zoukankan      html  css  js  c++  java
  • ng-select 下拉的两种方式

    <!doctype html>
    <html lang="en">
    <head>
    <meta charset="UTF-8" />
    <title>Document</title>
    </head>
    <body>
    <div ng-app="myapp" ng-controller="myctrl">
    <select ng-model="data" >
    <option value="">选择地址</option>
    <option ng-repeat="x in name">{{x}}</option>
    </select>
    </div>

    <div ng-app="app1" ng-controller="myctrl1" id="a">
    <select ng-options="x for x in name" ng-model="name">//必须添加ng-model
    <option value=""></option>
    </select>

    <select ng-model="p" ng-options="x.id as x.name for x in gg"></select>//便利数组对象

    {{p}}//输出对象的ID

    <select ng-model="a" ng-options="x.id as x.name group by x.key for x in gs"></select>//便利jeson并分组

    </div>
    </body>
    <script src="js/angurlar素材/angular/angular.js"></script>
    <script>
    var app =angular.module("myapp",[]).controller("myctrl",function($scope){
    $scope.name=["关关","xsss","sss"]

    });//运用ng-repeat完成项目

    var a=document.querySelector("#a");
    console.log(a)
    angular.module("app1",[]).controller("myctrl1",function($scope){
    $scope.name=["关关","x","sss"]//定义数组

    $scope.gg=[{id:1,name:"guanguan"}

           {id:2,name:"kankang"} 

    ]

    $scope.gs=[
    {id:1,name:"关关",key:"我的好友"},
    {id:2,name:"中中",key:"我的好友"},
    {id:3,name:"亮亮",key:"我的好友"},
    {id:4,name:"小小",key:"黑名单"},
    ]



    });//运用ng-options完成
    angular.bootstrap(a,["app1"])//运用bootstrop完成多个模块加载
    </script>
    </html>

  • 相关阅读:
    Java基础--day04
    Java基础--day03
    Java基础--day02
    高斯键盘设置指南
    博客园主题配置
    算法笔记--二分
    Test2反思
    树链剖分【模板】
    7.20关于莫队算法的一些初步理解
    分块(n根n复杂度)
  • 原文地址:https://www.cnblogs.com/a8497336/p/6748140.html
Copyright © 2011-2022 走看看