无法在angularjs中正确呈现指令模板？

Question

这里是指令

module.exports =()=>{ 
    return { 
    restrict: 'E', 
    templateUrl: "/components/event/event.html", 
    scope: {index: '@'}, 
    controller: "eventCtrl" 
    }; 
}; 

守则控制器

module.exports = ($scope)=>{ 
    console.log($scope.index); 
    $scope.loadDetails =()=>{ 
    console.log("hello there"); 
    } 
}; 

和模板

.event 
    h3(ng-bind="index.title") 
    p(ng-bind="index.description") 
    .price(ng-show="index.is_paid") {{cost}} $ 
    a.button-primary(ng-click="loadDetails()") Details 

问题是变量未在模板被渲染。我测试了是否使用console.log正确传递，我正在得到正确的回应。此外功能loadDetails()正常工作，使我相信设置控制器没有问题。我究竟在哪里出错？

Answer 1

你必须改变你的事业scope: {index: '@'}, @意味着它是string ..所以尝试使用：

module.exports =()=>{ 
    return { 
    restrict: 'E', 
    templateUrl: "/components/event/event.html", 
    scope: {index: '='}, 
    controller: "eventCtrl" 
    }; 
};