javascript 内部函数中的数组长度不同

yftpprvb  于 2023-11-15  发布在  Java
关注(0)|答案(1)|浏览(126)

我创建了一个自定义指令。现在我从chips-break属性传递字符串数据,并将其转换为link方法中的数组。它可以工作,但当我在ng-keydown方法中获取数组长度时,它就不同了。

HTML格式

<input-chips chips-break="32, 13, 188" style="width:80%"></input-chips>

字符串

JS

var app = angular.module("myApp", []);
app.directive("inputChips", inputChipsFun);

function inputChipsFun(){
  return{
    restrict : 'EA',
    scope : {
      chipsBreak : "@"
    },
    template: '<div class="chips"><div class="chips-item"></div><input type="text" ng-keydown="inputKeyDown($event, false)"/></div>',
    link : function(scope, elem, attr){
      scope.chipsBreak = scope.chipsBreak.split(",");
      console.log("Length of Chips Break First Time = "+scope.chipsBreak.length);
      
      scope.inputKeyDown = function($event, is_blur){
        console.log("Length of Chips Break Key Press = " + scope.chipsBreak.length);
      }
    }
  };
}


链接:https://plnkr.co/edit/RpDwaqjS81DZlZFEzdj2?p=preview
打开检查元素控制台并键入一些东西,看看有什么不同。

8gsdolmq

8gsdolmq1#

当你使用'@'时,它会得到一个字符串,这就是为什么你得到length == 11,因为你得到的是'32, 13, 188'字符串中的字符数。
查看此帖子以了解更多细节:What is the difference between '@' and '=' in directive scope in AngularJS?

link : function(scope, elem, attr){
  var x = scope.chipsBreak.split(",");
  console.log("Length of Chips Break First Time = "+scope.chipsBreak.length);
  
  scope.inputKeyDown = function($event, is_blur){
    console.log("Length of Chips Break Key Press = " + x.length);
  }
}

字符串
如果你执行scope.chipsBreak = scope.chipsBreak.split(","),你的scope.inputKeyDown(这是一个函数)将得到scope.chipsBreak的初始值,这是一个字符串。

相关问题