AngularJS : 사용자 정의 태그에서 속성 값 가져 오기

Question

저는 AngularJS의 초보자입니다. 여기서 내가 뭘 잘못하고 있는지 모르는 것은 제 코드입니다. 기본적으로 내 index.html에서 post-id의 속성 값을 가져와 내 컨트롤러에서 콘솔로 인쇄하려고합니다. 내 index.html을에서

:

<post-creator post-id="5" category="1"></post-creator> 
<script src="components/post-creator/post-creator.component.js"></script> 

후 creator.component.js :

이

function controller($http) { 
     var model = this; 

     model.$onInit = function() { 
      console.log("id again:" + model.postId); 
     } 
module.component("postCreator", { 
     templateUrl: "components/post-creator/post-creator.template.html", 
     bindings: { 
      value: "<" 
     }, 
     controllerAs: "model", 
     controller: ["$http", controller] 
    }); 

Answer 1

되는 HTML에서, 당신은 post-id="..." category="..."을 통과하고 있기 때문에, 그들은의 bindings의 일부가되어야 당신의 component이고 value이 아님. 이처럼 :

여기

bindings: { 
    postId: "<", 
    category: "<" 
} 

샘플 작업 예제 :

var module = angular.module("myApp", []) 
 

 
function controller($http) { 
 
    var model = this; 
 

 
    model.$onInit = function() { 
 
    console.log("id again:" + model.postId); 
 
    } 
 
} 
 

 
module.component("postCreator", { 
 
    template: "<div>post creator</div>", 
 
    bindings: { 
 
    postId: "<", 
 
    category: "<" 
 
    }, 
 
    controllerAs: "model", 
 
    controller: ["$http", controller] 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script> 
 
<div ng-app="myApp"> 
 
    <post-creator post-id="5" category="1"></post-creator> 
 
</div>