AngularJS:ng-init的范围

Question

Angular中ng-init的范围是什么？这是一个演示我的问题的简单示例:

    <div ng-init="model = { year: '2013'}">
      <a href="" ng-click="model.year = '2012'">2012</a> | <a href="" ng-click="model.year = '2013'">2013</a>
      <div>Showing {{ model.year }}</div>
      <hr />
    </div>
    <div ng-init="model = { year: '2013'}">
      <a href="" ng-click="model.year = '2012'">2012</a> | <a href="" ng-click="model.year = '2013'">2013</a>
      <div>Showing {{ model.year }}</div>
    </div>

此处提供实时示例:http://plnkr.co/edit/HkioewOzzglvFMKDPdIf？p = preview

似乎ng-init范围在2 div [ng-init]之间共享.例如,如果您点击"2012"年,则会更改这两个部分.有没有办法告诉angular为每个ng-init创建一个新的范围,从而点击'2012'年只会影响它所属的部分？

Answer 1

ng-init不会创建新范围,它会计算当前范围中的表达式.在您的示例中,两者ng-init都在同一范围内,更改相同的模型属性将影响另一个.如果您需要单独的范围,您可以尝试ng-controller.

<div ng-controller="MainCtrl" ng-init="model = { year: '2013'}">
      <a href="" ng-click="model.year = '2012'">2012</a> |  <a href="" ng-click="model.year = '2013'">2013</a>
      <div>Showing {{ model.year }}</div>
      <hr />
    </div>
<div ng-controller="MainCtrl" ng-init="model = { year: '2013'}">
      <a href="" ng-click="model.year = '2012'">2012</a> |  <a href="" ng-click="model.year = '2013'">2013</a>
      <div>Showing {{ model.year }}</div>
 </div>

DEMO

附注:在这种情况下,您不需要ngInit,只需在控制器中直接初始化值即可.

ngInit的唯一合适用途是用于别名ngRepeat的特殊属性.除了这种情况,您应该使用控制器而不是ngInit来初始化作用域上的值.

https://docs.angularjs.org/api/ng/directive/ngInit