在指令元素參數中獲取HTML標記

Question

In this plunk我有一個用UL元素聲明的指令。

<directive> 
    <ul> 
    <li id="0">xxx 0</li>   
    <li id="1">xxx 1</li>   
    <li id="2">xxx 2</li>   
    </ul> 
</directive> 

我試圖通過分析向鏈路功能element參數檢索這些，但我只讓他們在innerHTML之中。我需要的是將li元素的ID和文本作爲DOM獲取。有任何想法嗎？

angular.module('app', []); 
angular.module('app').directive('directive', function() { 
    var directive = {}; 
    directive.restrict = 'AE'; 
    directive.scope = true; 
    directive.link = function(scope, element, attrs) {  
     console.log(element) 
    }; 
    return directive; 
}); 

Answer 1

既然你在指令中有元素你不必使用querySelector，

你可以直接做，

directive.link = function(scope, element, attrs) { 
     console.log(element.find("ul")[0].children); 
}; 

DEMO

Answer 2

是的，你可以。如果你記錄元素，那麼你會看到它是一個類似於對象的數組，你需要先選擇數組的鍵來獲取HTML元素。

.directive('directive', function() { 

var directive = {}; 
directive.restrict = 'AE'; 
directive.scope = true; 
directive.link = function(scope, element, attrs) { 
    console.log(element[0].querySelector('ul'));//Element is an array like object 
}; 
return directive; 

}）;

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