• AngularJS 第四课(选择框,HTML DOM,HTML 事件)


    选择框

    使用ng-options可以编写选择框。
    实例:
    
    <div ng-app="myApp" ng-controller="myCtrl" >
        <select ng-model="selecName" ng-options="x for x in names"></select>
    </div>
    
    <script>
        var app=angular.module('myApp',[]);
        app.controller('myCtrl',function($scope){
            $scope.names=["1","2","3"];
    
        });
    </script>

    使用no-repeat可以起到一样的效果
    实例:

    
    <div ng-app="myApp" ng-controller="myCtrl" >
        <select >
            <option ng-model="selecName" ng-repeat="x in names">{{x}}</option>
        </select>
    </div>
    
    <script>
        var app=angular.module('myApp',[]);
        app.controller('myCtrl',function($scope){
            $scope.names=["1","2","3"];
    
        });
    </script>

    相比之下ng-option选择的是对象,而ng-repeat是选择数据。

    ng-disabled

    实例:
    
    <div ng-app="" ng-init="mySwitch=false">
    <p>
    <button ng-disabled="mySwitch">点我!</button>
    </p>
    <p>
    <input type="checkbox" ng-model="mySwitch"/>按钮
    </p>
    
    {{ mySwitch }}
    
    </div> 

    ng-show

    实例:
    
    <div ng-app="">
    <p ng-show="true">我是可见的</p>
    <p ng-show="false">我是不可见的</p>
    </div>

    ng-click

    实例:
    
    <div ng-app="" ng-init="count=0">
    <p ng-click="count=count+1">
        {{count}}
    </p>
    </div>
    本博客基于网络课程完成,旨在学习,有错误请指正!
  • 相关阅读:
    完全背包笔记
    渗透测试之信息收集常用网站
    结对项目-四则运算"软件"之升级版
    第三次作业:个人项目-小学四则运算“软件”之初版
    分布式版本控制系统Git的安装与使用
    第一次作业:准备
    爬虫综合大作业
    爬取全部校园新闻
    理解爬虫原理
    中文词频统计与词云生成
  • 原文地址:https://www.cnblogs.com/comefuture/p/8305966.html
Copyright © 2020-2023  润新知