爲什麼在指令標籤內傳遞對象時我得到字符串

Question

我無法訪問我將它傳遞給我的指令的對象。

// inside dialogController 
showAlert(ev) { 
    this.mdDialog.show({ 
      template:"<loader my-master="+this.masterCtrl+"></loader>" 
    }); 

// when debugging, I saw this.masterCtrl is exist as Object 


//inside loader Controller: 

export function loader() { 
    'ngInject'; 
    let directive = { 
    templateUrl: "app/components/excelLoader/loader.html", 
    controller: loaderController, 
    controllerAs: 'vm', 
    scope: { 
     words: '=', 
     master:'=myMaster' 
    }, 
    replace: true, 
    bindToController: true, 
    link: linkFunc 
    }; 


    function linkFunc(scope, element, attr, ctrl) { 
    let vm = scope.vm; 
    ctrl.master=attr.myMaster; 
    } 
    return directive; 
} 
class loaderController { 
    constructor() { 
    'ngInject'; 
    console.log(this.master); //prints string "this.masterCtrl" instead of the Object! 
} 
} 

什麼是從dialogController傳遞this.masterCtrl到loader指令以及如何使用它在loader指令中訪問它的正確方法？

Answer 1

這是你想要的嗎？ - CodePen

標記

<div ng-controller="MyController as vm" ng-cloak="" ng-app="app"> 
    <md-button class="md-primary md-raised" ng-click="vm.openDialog($event)"> 
    Dialog 
    </md-button> 
</div> 

JS

angular.module('app',['ngMaterial', 'ngMessages', 'material.svgAssetsCache']) 

.controller('MyController', function($scope, $mdDialog) { 
    var vm = this; 

    vm.testObject = {test: "blah"}; 

    vm.openDialog = function(ev) { 
    $mdDialog.show({ 
     controller: 'DialogController', 
     controllerAs: 'DialogCtrl', 
     template: '<loader my-master="vm.testObject"></loader>', 
     parent: angular.element(document.body), 
     scope: $scope, 
     preserveScope: true, 
     targetEvent: ev, 
     clickOutsideToClose:true 
    }); 
    }; 
}) 

.controller('DialogController', function($scope, $mdDialog) { 
}) 

.directive("loader", loader); 

function loader() { 
    return { 
    template: "<div>Loader directive - {{vm.master.test}}</div>", 
    controller: loaderController, 
    controllerAs: 'vm', 
    scope: { 
     words: '=', 
     master:'=myMaster' 
    }, 
    replace: true, 
    bindToController: true, 
    }; 

    function loaderController ($scope) { 
    console.log($scope.vm.master); 
} 
} 

Answer 2

在你的鏈接函數中，分配ctrl.master = scope.master;attr.myMaster將從html標籤讀取屬性值，並且將是一個字符串。 scope.master將按角度評估。