该API参考范围页面说:
范围可以从父范围继承.
该开发者指南范围页说:
范围(原型)从其父范围继承属性.
那么,子范围是否始终从其父范围继承原型?有例外吗?当它继承时,它是否总是正常的JavaScript原型继承?
javascript inheritance prototype prototypal-inheritance angularjs
如果您需要更多信息或希望我澄清任何问题,请告诉我.我已经尝试了很多不同的东西来解决这个问题,但还没有找到解决方案.
我是angularJS的新手,我正在尝试构建一个包含多层数据的应用程序.我有一些基本的用户信息存储在控制器PageController的正文范围内.然后我有一个设置表单,使用$ routeParams(带控制器SettingsController)加载,其中包含一些用于模板目的的自定义指令.由于指令是嵌套的,我使用transclusion来加载第一个指令.这一切似乎都很正常.
我的问题是我试图user.firstname从最里面的指令中引用该字段,并希望使用双向数据绑定来允许对文本框所做的更改导致PageController范围内的值也发生变化.我知道很多这类问题是由在ng-model中使用原语引起的,但是我已经尝试将所有内容都放在一个额外的对象中,这样我才能触发原型继承无济于事.我在这做错了什么?
这是我的代码的JSFiddle,尽可能地剥离以隔离问题.在这个例子中,如果我输入外部文本框,它直接在PageController范围内,它将修改内部文本框,直到该文本框被修改,连接断开.这看起来就像其他问题中描述的使用原语的问题,但我无法弄清楚问题出在哪里.
HTML:
<body class="event-listing" ng-app="app" ng-controller="PageController">
<div class="listing-event-wrap">
<input type="text" ng-model="user.firstname" />
<div ng-controller="SettingsController">
<section block title="{{data.updateInfo.title}}" description="{{data.updateInfo.description}}">
<div formrow label="{{data.updateInfo.labels.firstname}}" type="textInput" value="user.firstname"></div>
</section>
</div>
</div>
</body>
Run Code Online (Sandbox Code Playgroud)
角度指令:
app.directive('formrow', function() {
return {
scope: {
label: "@label",
type: "@type",
value: "=value"
},
replace: true,
template: '<div class="form-row">' +
'<div class="form-label" data-ng-show="label">{{label}}</div>' +
'<div class="form-entry" ng-switch on="type">' +
'<input type="text" ng-model="value" data-ng-switch-when="textInput" />' +
'</div>' +
'</div>'
}
});
app.directive('block', function() {
return …Run Code Online (Sandbox Code Playgroud) 我对Angular有点新意,所以如果这是一个菜鸟问题我会道歉.基本上我有一个控制器试图改变父范围的值.它成功但父视图永远不会更新.
我的父视图如下:
<html ng-app="app" ng-controller="appController">
<head>
...
</head>
<body>
This is the outer view.<br>
<br>
{{ welcome }}
<div ng-view style="width: 100%; border: 1px solid black; padding: 10px;">
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
我正试图让一个子控制器来改变welcome这里看到的值.
app
.controller('homeController', function ($scope) {
$scope.welcome = "Hello world!"
$scope.$parent.welcome = "It works!!!!!!!!!";
console.log("Home controller loaded.");
})
.controller('appController', function ($scope) {
$scope.welcome = "It doesn't work!"
console.log("App controller loaded.");
});
Run Code Online (Sandbox Code Playgroud)
代码执行但我从未看到消息"它工作!!!!!!!" 像我期待的那样.这是一个展示我的问题的傻瓜:http://plnkr.co/edit/Dywofrx0u3QOaiKe9MsJ?p =preview