在Angularjs中将两个值放在ng模型中

时间:2014-04-11 08:40:04

标签: angularjs

我需要显示当前位置存储或当前员工目前的库存

<select class=" form-control"  ng-model="location.name">
        <option value="">Choose Location</option>
    <optgroup label="Locations">
        <option value="{{location.resource_uri}}" ng-repeat="location in locations">{{location.name}}</option>  
    </optgroup>
    <optgroup label="Holder">
        <option value="{{user.resource_uri}}" ng-repeat="user in users">{{user.first_name + ' ' + user.last_name}}</option>
    </optgroup>
</select>

我可以在ng-model中输入两个值,所以如果location不为null,我会获得当前位置,如果该位置为null,我会选择员工姓名。

1 个答案:

答案 0 :(得分:0)

看看这个

<强> Working Demo

<强> HTML

    <div class="form-control"  ng-app="main" ng-controller="Controller">
    <select ng-model="category">
        <optgroup ng-repeat="category in categories" label="{{ category.name }}">
            <option ng-repeat="subCat in category.items"> 
                <span ng-switch="category.name">
                    <span ng-switch-when="Location">
                        {{ subCat.name }}
                    </span>
                    <span ng-switch-when="Holder">
                        {{subCat.first_name+" "+subCat.last_name}}
                    </span>
                </span>
            </option>
        </optgroup>
    </select>

    {{category}}
</div>

<强>脚本

var main = angular.module('main', []);
// Main Controller
main.controller('Controller', function ($scope) {
    $scope.categories = [{
        id: 5,
        name: "Locations",
        items: [{
            resource_uri: 'ABC',
            name: "ABC-Name"
        }, {
            resource_uri: 'XYZ',
            name: "XYZ-Name"
        }, {
            resource_uri: 'LMN',
            name: "LMN-Name"
        }, {
            resource_uri: 'PQR',
            name: "PQR-Name"
        }]
    }, {
        id: 17,
        name: "Holder",
        items: [{
            first_name: 'Manu',
            last_name: 'Mathew'
        }, {
            first_name: 'Sunny',
            last_name: 'Mathew'
        }, {
            first_name: 'Jacob',
            last_name: 'Mathew'
        }, {
            first_name: 'Vijay',
            last_name: 'Mathew'
        }]
    }];
});