將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

回答

相關問題