如何使用属性禁用日期字段

how to disable date field using attribute?

本文关键字:日期 字段 何使用 属性      更新时间:2023-09-26

我正在尝试禁用字段using属性我不想使用指令作用域属性(=,@,&)我想使用属性属性禁用type='date'字段

这是我的代码

http://plnkr.co/edit/eJDRocLYkr8Krh84vFKY?p=preview

 var app = angular.module('plunker', []);
    app.controller('MainCtrl', function($scope) {
      $scope.name = 'World';
      $scope.clickb=function(){
        alert('dd')
        $scope.disabletest=true;
      }
    });
    app.directive('test',function(){
      return {
        restrict :'E',
        scope:{},
        template:'<input type="date" ng-disable="disabletest">',
        link:function(s,e,a){
        }
      }
    })

我正在发送指令中的disable属性值,以禁用单击按钮时的字段。

我想使用属性属性

禁用按钮点击时的输入字段(类型="日期")

尝试此操作,将ng-disable更改为ng-disabled,并创建范围变量

var jimApp = angular.module("mainApp",  []);
jimApp.controller('mainCtrl', function($scope){
  $scope.disabletest = false;
  $scope.clickb=function(){
    $scope.disabletest=!$scope.disabletest;
  };
});
jimApp.directive('test',function(){
  return {
    restrict :'E',
    template:'<input type="date" ng-disabled="disable">',
    link:function(s,e,a){
      a.$observe('disable', function(value) {
      s.disable = s.$eval(a.disable);
    });
  }
    }
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script>
<div ng-app="mainApp" ng-controller="mainCtrl">
  <button ng-click='clickb()'>btn</button>
  <test disable='{{disabletest}}'></test>
</div>

应该是

 ng-disabled="expression"

index.html

<!DOCTYPE html>
<html ng-app="plunker">
  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.9/angular.js" data-semver="1.4.9"></script>
    <script src="app.js"></script>
  </head>
  <body >
    <div ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>
    <button ng-click='clickb()'>btn</button>
    <input type="date" ng-disabled='disabletest'>    
    </div>
  </body>
</html>

into指令,您必须指定一个属性来获得disabletest值

虽然您真的不应该使用$parent,但更改作用域是Jimbrooism建议的最佳解决方案。这是不修改范围的解决方案。更改为:

template:'<input type="date" ng-disabled="$parent.disabletest">',

http://plnkr.co/edit/ZBKv63aroXrao7GO9P2u?p=preview