>我有三个状态：一个抽象状态和两个继承自抽象状态的具体状态。我正在从一种状态过渡到另一种状态，我注意到在我转换到另一种状态后，处于一种状态的$scope中的变量不再处于$scope状态：请参阅下面的$scope.signupForm.member.email。
有人可以建议吗？
我的UI路由器配置：
$stateProvider
.state('signup', {
abstract: true,
views: {
'@': {
templateUrl: 'signup/views/signup.html'
}
}
})
.state('signup.form', {
url: '/signup',
views: {
'@signup': {
controller: 'SignupCtrl',
templateUrl: 'signup/views/signup.form.html'
}
}
})
.state('signup.success', {
url: '/signup/success',
views: {
'@signup': {
controller: 'SignupCtrl',
templateUrl: 'signup/views/signup.success.html'
}
}
})
来自我的控制器的相关代码段：
signupService.signup($scope.signupForm)
.success(function () {
//TODO: issue with controller no longer being in scope: signupForm.member.email is not displayed in template
$state.go('signup.success');
});
我的电子邮件输入(来自signup.form.html)：
<input type="email" name="email"
placeholder="{{'SIGNUP_FORM_EMAIL' | translate}}"
ng-model="signupForm.member.email" ng-required="true"
ng-pattern="EMAIL_PATTERN"
class="form-control"/>
我尝试显示电子邮件的位置(来自signup.success.html)：
<div class="panel-body">
success!
check your email at: {{signupForm.member.email}}
</div>
编辑 1：
如果我将控制器拉高一级 - 通过将其置于抽象状态，即">注册"，那么signupFormCtrl- 角度形式控制器 - 是undefined！
<form name="signupFormCtrl" ng-submit="signup()" novalidate>
编辑2：
这是我尝试过的：
.state('signup', {
abstract: true,
views: {
'@': {
controller: 'SignupCtrl',
templateUrl: 'signup/views/signup.html'
}
}
})
.state('signup.form', {
url: '/signup',
views: {
'@signup': {
templateUrl: 'signup/views/signup.form.html'
}
}
})
.state('signup.success', {
url: '/signup/success',
views: {
'@signup': {
templateUrl: 'signup/views/signup.success.html'
}
}
})
Thre 是一个工作 plunker
这可以通过UI-Router内置功能来实现。我们需要为基本状态引入控制器：
.state('signup', {
abstract: true,
templateUrl: 'signup/views/signup.html',
controller: 'SignupBaseCtrl',
})
在这个控制器内部，我们将在$scope内定义一个模型：
.controller('SignupBaseCtrl', ['$scope', function ($scope) {
$scope.signupForm = { member : { email : null }};
}])
现在，如果我们使用这样的模型：
{{signupForm.member.email}}
在我们的任何子状态中，我们将访问相同的模型，相同的引用对象singupForm。
这怎么可能？它是如何工作的？这里清楚地解释了所有内容：
仅按视图层次结构进行范围继承
请记住，仅当状态的视图嵌套时，范围属性才会沿状态链向下继承。范围属性的继承与状态的嵌套无关，而与视图(模板)的嵌套有关。
您完全有可能具有嵌套状态，其模板在站点内的各个非嵌套位置填充 ui 视图。在此方案中，您不能期望在子状态的视图中访问父状态视图的范围变量。
您还可以检查：子视图无法访问父布局中的控制器
不能从一个范围访问另一个范围中的数据。 尝试对要跨范围使用的数据使用 rootScope 在模板中使用$root，如在{{$root.signupForm.member.email}}中使用，在控制器中使用$rootScope，如在$rootScope.signupForm.member.email