0

我有一个复杂的模型结构（详见下文），每次我想使用时，ng-model我都必须访问确切的属性，如下所示user.communications.inGame.selected：

我希望能够确定一个区域的范围并能够在selected 没有所有前缀的情况下使用内部（简单地编写selected），就像我能够使用ng-repeat.

ng-repeat不适合这里，因为每个通信内部都有不同的属性，而且我不希望ng-switch它内部有一个巨大的。

数据结构

 $scope.user.communications = {
            inGame: {
                name: 'inGame',
                selected: true,
                image: 'assets/img/communication/ingame.png'
            },
            teamspeak: {
                name: 'teamspeak',
                selected: true,
                image: 'assets/img/communication/ts.png',
                serverAddress: '',
                port: '',
                nickname: '',
                password: '',
                channel: '',
                channelPassword: '',
                autoBookmarkAdd: ''
            },
            skype: {
                id: 3,
                name: 'skype',
                selected: true,
                image: 'assets/img/communication/skype.png',
                username: ''
            },
            ventrilo: {
                name: 'ventrilo',
                selected: true,
                image: 'assets/img/communication/ventrilo.png',
                serverName: '',
                port: '',
                serverPassword: '',
                channelName: '',
                channelPassword: ''
            }
        };
4

2 回答 2

0

请检查下面的html，你可以像这样使用它

 <div ng-app>
  <h2>Todo</h2>
   <div ng-controller="TodoCtrl">      
     <ul class="unstyled">
       <li ng-repeat="todo in user.communications">
         {{todo.selected}}
      </li>
    </ul>    
 </div>
    </div>

并在控制器中

function TodoCtrl($scope) {
$scope.user={};
$scope.user.communications = {
        inGame: {
            name: 'inGame',
            selected: true,
            image: 'assets/img/communication/ingame.png'
        },
        teamspeak: {
            name: 'teamspeak',
            selected: true,
            image: 'assets/img/communication/ts.png',
            serverAddress: '',
            port: '',
            nickname: '',
            password: '',
            channel: '',
            channelPassword: '',
            autoBookmarkAdd: ''
        },
        skype: {
            id: 3,
            name: 'skype',
            selected: true,
            image: 'assets/img/communication/skype.png',
            username: ''
        },
        ventrilo: {
            name: 'ventrilo',
            selected: true,
            image: 'assets/img/communication/ventrilo.png',
            serverName: '',
            port: '',
            serverPassword: '',
            channelName: '',
            channelPassword: ''
        }
    };

}

请参考：http: //jsfiddle.net/U3pVM/1505/

于 2013-10-04T14:14:44.400 回答
0

如果您想在单独选择每个项目的同时动态创建范围$scope.user.communications，您可以简单地使用ng-init. 但是，它至少需要一个前缀

    <div ng-model="one" ng-init="one=user.communications.inGame">
        {{ one.selected }}
    </div>
    ...
于 2013-10-04T14:41:31.563 回答