Question

我可以使用

检查我是否关注特定元素

ng-focus="focus=true" ng-blur="focus=false"

但问题是我想制作自定义指令，以便在焦点丢失后更改我的元素模型，所以我认为我无法使用ng-focus或ng-blur。好吧，让我告诉你我究竟想要什么假设我有一个文本框如果用户输入10和tab，那么，在失去焦点后，我的文本框必须返回当月和年份例如，如果用户输入

输出应为10/12/2016

Thanku

Answer 1

使用ng-change

查看ng-model-options

http://www.w3schools.com/angular/ng_ng-model-options.asp

https://docs.angularjs.org/api/ng/directive/ngModelOptions

这是您可以扩展的基本plnkr： https://plnkr.co/edit/crkrhOic70dYjViuUh6x?p=preview

app.component('myComponent', {
  bindings: {
    obj: '<'
  },
  template: '<input type="text" ng-model="$ctrl.someDate" ng-model-options="{updateOn: \'blur\'}" ng-change="$ctrl.change()"/>',
  controller: function MyComponentCtrlx() {

    this.change = ()=>{
      this.someDate += '/12/2016';
    }
  }
});

Answer 2

您可以将ng-model与ng-blur和特定方法（changeDate()）一起使用，以便在焦点丢失时返回所需内容：

HTML：

<input type="text" ng-model="textInput" ng-blur="changeDate()">

控制器：

$scope.changeDate = function () {
    $scope.textInput = $scope.textInput + '/12/2016';
}

当然，你应该在changeDate中添加一种更好的方法来计算日期。我做了一些快速的事情只是为了给你一个想法。

编辑：对不起，当你失去焦点时它会变成模糊

将其用作指令：

JS：

app.directive('myInput', function() {
  return {
      restrict: 'E',
      replace: 'true',
      scope: {
         inputdata: '='
      },
      template: '<input type="text" ng-model="inputdata" ng-blur="changeDate()">',
      controller: function ($scope) {
         $scope.changeDate = function () {
             $scope.inputdata = $scope.inputdata + '/12/2016';
         }
      }
  };
});

HTML：

<my-input inputdata="textInput"></my-input>

在角度js失去焦点后更改元素的指令

2 个答案: