AngularJS: Erhalten Attributwert von benutzerdefinierten Tags

Question

Ich bin ein Neuling von AngularJS weiß nicht, was ich hier falsch mache ist mein Code. Im Grunde versuche ich, Attributwert von Post-ID von meinem index.html zu bekommen und es in der Konsole von meinem Controller zu drucken.

In meinem index.html:

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

post-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

Da im HTML, Sie post-id="..." category="..." sind vorbei, sollen sie Teil bindings von Ihrer component und nicht value. Wie folgt aus:

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

Hier ist ein Beispiel Arbeitsbeispiel:

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>