AngularJS中 ng-select 实例

来源：互联网发布：淘宝赔付基金赔付规则编辑：程序博客网时间：2024/05/18 18:55
参考链接：
http://www.tuicool.com/articles/RniIRv
代码实例：
<html ng-app="myApp"><head>    <meta charset="utf-8" />    <script src="angular.js"></script>    <script src="angular-messages.js"></script></head><body>    <div ng-controller="controller">        m.ProductName for m in Model        <select ng-model="Select1" ng-options="m.ProductName for m in Model">            <option value="">-- 請選擇 --</option>        </select>        {{Select1}}        <hr> (m.ProductColor + ' - ' + m.ProductName) for m in Model        <select ng-model="Select2" ng-options=" (m.ProductColor + ' - ' + m.ProductName) for m in Model">            <option value="">-- 請選擇 --</option>        </select>        {{Select2}}        <hr> (m.ProductColor + ' - ' + m.ProductName) group by m.MainCategory for m in Model        <select ng-model="Select3" ng-options="(m.ProductColor + ' - ' + m.ProductName) group by m.MainCategory for m in Model">            <option value="">-- 請選擇 --</option>        </select>        {{Select3}}        <hr> m.id as m.ProductName for m in Model        <select ng-model="Select4" ng-options="m.id as m.ProductName for m in Model">            <option value="">-- 請選擇 --</option>        </select>        {{Select4}}        <hr>        <p> $scope.Model = [ { id: 10001, MainCategory: '男', ProductName: '水洗T恤', ProductColor: '白' },            <br>{ id: 10002, MainCategory: '女', ProductName: '圓領短袖', ProductColor: '黃' },            <br>{ id: 10003, MainCategory: '女', ProductName: '方領短袖', ProductColor: '红' }];        </p>    </div>    <script>        angular.module('myApp', [])            .controller('controller', function ($scope) {                $scope.Model = [                    {                        id: 10001,                        MainCategory: '男',                        ProductName: '水洗T恤',                        ProductColor: '白'},                    {                        id: 10002,                        MainCategory: '女',                        ProductName: '圓領短袖',                        ProductColor: '黃'},                    {                        id: 10003,                        MainCategory: '女',                        ProductName: '方領短袖',                        ProductColor: '红'}];            })    </script></body></html>
0 0