将javascript转换为angularjs

-1

嗨我是AngularJS的新手，并且还没有太多的经验，所以我在这里有一个javascript，我想翻译成AngularJs。我想使用angularjs从列表中获得id。将javascript转换为angularjs

这是我的Python列表：

MissionNameList = [{'id':'1','name':'Alabama'},{'id':'2','name': 'Alaska'}]

这是我的html：

<input type="text" 
    id={{ thisName }} 
    ng-model="selected"i 
    ng-keyup="keyPress($event.keyCode)" 
    typeahead="mission as mission.name for mission in missionNameList | filter:{name:$viewValue} | limitTo:8" 
    name={{ missionname }} 
    disabled> 
    {{ missiontitle }} 

<input type="hidden" 
    id={{ thisId }} 
    name="{{ field.name }}" 
    value="{{field.value}}">

现在我使用纯JavaScript，但不是JavaScript的我想用AngularJs，有任何方式我可以使用AngularJs得到相同的结果？谢谢。

这是我的脚本：

var missionName = document.getElementById('missionName'); 
    var missionId = document.getElementById('missionId'); 

    var nameList = {{ MissionNameList|safe }} 

    missionName.addEventListener('keyup', function(e){ 
     var value = e.target.value; 

     for(var i=0; i<nameList.length; i++){ 
      var name = nameList[i].name; 

      if(name == value) { 
       missionId.value = nameList[i].id; 
       break; 
     } 
    } 
}, false);

我感谢所有帮助。谢谢。

来源

2016-03-11 acknolodgia

是你尝试一些东西？你在这里做什么'var nameList = {{MissionNameList | safe}}'？ – Grundy

也把你的HTML代码。根据我的理解，missionName＆missionId是输入类型的文本元素。对？ – murli2308

这是编辑的代码。 – acknolodgia

正如我所看到的，您将得到一个输入 DOM元素，并且您可以为其添加一个侦听器'keyup'。

在'keyup'上你想获得输入值，你可以读取一个数组并为你的'missionId'元素赋值。

在angularjs我们操纵DOM元素到指令：

你可以做到这一点与这样的指令，但它会更好地阅读文档：

.directive('myField', function($log, $http, $compile) { 
    return { 
     restrict: 'AE', 
     replace: true, 
     scope: { 
     nameList: '=',//pass the array from controller 

     }, 
     templateUrl: 'mytemplate.tpl.html', 
     link: function(scope, element, attrs) { 

     element.bind("keyup", function() { 
       //something here , like read your array     
      }); 
     } 

    } 
    });

来源

2016-03-11 07:11:09

将javascript转换为angularjs

回答

相关问题