Question

我有这个作用域数组变量

$scope.menuItems = [
        {
            name: 'Login',
            url:'#/login',
            isAvailable: true
        },
        {
            name: 'Register',
            url: '#/register',
            isAvailable: $scope.global.roleId == null
        },
        {
            name: 'My Restaurants',
            url: '#/myrestaurants',
            isAvailable: $scope.global.roleId == constants.OWNER_USER_ROLE_ID
        },
        {
            name: 'Create Restaurant',
            url: '#/createrestaurant',
            isAvailable: $scope.global.roleId == constants.OWNER_USER_ROLE_ID
        },
        {
            name: 'Logout',
            url: '#/logout',
            isAvailable: $scope.global.roleId != null
        }
    ];

该对象依赖于另一个范围变量$scope.global.roleId

我正在像这样从这个数组加载菜单

<ul class="nav navbar-nav">
    <li ng-repeat="n in menuItems | filter:{isAvailable:true}">
        <a href="{{n.url}}">{{n.name}}</a>
    </li>                      
</ul>

我希望它在$scope.global.roleId更新时自动更新菜单。

请注意，我正在从子控制器中更新此变量$scope.global.roleId，并且此字段正在正确更新，但不会影响数组字段isAvailable。

我检查了日志中的变量$scope.global.roleId和$scope.menuItems，并且$scope.global.roleId每次都正确更新，但是$scope.menuItems.isAvailable字段却没有更新，这取决于前者

我在做什么或期待什么错误？而实现此目标的正确方法是什么？

Answer 1

这样实现，将变量转换为属性

{
    name: 'My Restaurants',
    url: '#/myrestaurants',
    get isAvailable() {
        return $scope.global.roleId == constants.OWNER_USER_ROLE_ID;
    }
},

AngularJS-数组项相关属性未更新

1 个答案: