即使模型值发生更改,ng-init也只会获取一次值

时间:2014-07-25 12:24:57

标签: angularjs

我的模型中有一个status深度嵌套到3个级别,我想根据status的值将不同的类应用于div。为了保存输入并保持html整洁,我想将短名称应用于此状态,因此我使用ng-init复制值并在ng-class变量上使用ng-init。但是ng-init只获得一次值,当我在控制器中再次更改状态时它不会改变但保留旧值。 有没有办法在div中至少为response.obj1.obj2.status提供短名称?

<div ng-app="app">
<div ng-controller="statusCtrl">
    <button ng-click="toggle()">toggle</button>
    <div id="section1" ng-init="s1Status=response.section1.status">
        <div id="statusIndicator" ng-class="{'success':s1Status==0,'error':s1Status==1}">Status</div>
        </div>
<span>{{response.section1.status}}</span>

    </div>

var app = angular.module('app', [])
app.controller('statusCtrl', function ($scope) {
    $scope.response = {
        section1: {
            status: 1
        }
    };
    $scope.toggle = function () {
        if ($scope.response.section1.status === 0) $scope.response.section1.status = 1;
        else $scope.response.section1.status = 0;
    }

});

演示:http://plnkr.co/edit/ES7rgf97BPFAWzkfIEhw?p=preview

编辑:

Knockout JS 有很好的方法可以做到这一点,你可以将任何级别的模型绑定到div,并且div中引用的任何模型都可以使用parnet模型作为上下文。这就是我在寻找的东西。

<div id="section1" data-bind="response.section1">
        <div id="statusIndicator" data-bind=" css:{success:status==0, error:status=1 }">Status</div>
        </div>

0 个答案:

没有答案