角度指令数据绑定

Question

I'm trying to write a simple Angular directive that displays an object properties, but I don't understand how the binding works.

<div ng-repeat="c in cars">
   <div car carElement={{c}}></div>
<div>  

.directive('car', function() {
  return {
   template: function(elem, attr){
     var car = attr.carElement;
     return car.brand + ' ' + car.model; 
   }
 };
});

I can't bind the hole object, just simple properties. For example, this works:

<div ng-repeat="c in cars"> 
  <div car brand={{c.brand}} ></div> 
<div> 
.directive('car', function() { 
  return { 
    template: function(elem, attr){ 

    var brand = attr.brand; 
    return ''+brand; 
  } 
  }; 
});

How can I send the entire car to the directive template?

Answer 1

You have to pass the object, but not inside an expression:

<div ng-repeat="c in cars">
   <div car carElement="c"></div>
<div>  

Directive:

.directive('car', function() {
  return {
   scope: { car: "=carElement" },
   template: function(elem, attr){
     //you now have 'car' in scope.car
   }
 };
});