要素IDを取得できません

Question

要素と属性IDを取得しようとしている次のディレクティブがありますが、定義されていません。

コード：

'use strict'; 

angular.module('clientApp') 

.directive('myVideo', function(){ 
    return { 
    restrict: 'A', 
    replace: true, 
    template: '<div style="border:solid 10px gray; width:auto;">'+ 
       '<video style="width:100%; height:auto;" controls>'+ 
       '<source src="views/unit_1.mp4" type="video/mp4" id="video">'+ 
       '</video>'+ 
       '{{test}}</div>', 
    link: function(scope, elem, attrs) { 
     console.log('Elements', elem.id); 
     console.log('Attributes', attrs.id); 
    } 
    }; 
}); 

Answer 1

を参照してくださいのようなものを使用します

id attrib uteは、HTML要素に対してunique idを指定します。これは、主にstyle in stylesheetを指すのに使用され、特定のIDを持つJavaScript to manipulate the DOM elementsによって指し示されます。

プロパティidは、要素のid（要素のid属性の値）を設定または返します。

したがって、ディレクティブ属性にid属性を定義する必要があります。

<div my-video id="videoId"></div> 

したがって、あなたがラインのこれらのコードでコンソールがログに記録されますとき、それはあなたのid属性の値を返します。

console.log('Elements', elem.id);  // 'Elements', videoId 
console.log('Attributes', attrs.id); // 'Attributes', videoId 

Answer 2

idは何もありませんが、あなたはlink機能の第3パラメータ（attrs）内に直接属性のコレクションにアクセスできるように、ディレクティブに存在属性。あなたが@Philを適用することができますが答えを提案した。

あなたのケースでは、あなたの指示要素にid属性があるはずです。しかるに、コンソールだけしか見ることができません。 （含まれている場合やjQueryの）

ディレクティブ link機能で

<div my-video id="myId"></div> 

Answer 3

、elemはjqLit​​eオブジェクトであるので、あなたは

elem.prop('id') 

または

elem.attr('id') 

https://docs.angularjs.org/api/ng/function/angular.element