angular.js - 傳遞對象從指令視圖控制器

Question

*請注意：有一個Plunker鏈接： https://plnkr.co/edit/PAINmQUHSjgPTkXoYAxf?p=preview

起初我想傳遞一個對象作爲指令點擊事件參數， （對我來說太複雜了），所以我決定通過分別發送事件和對象來簡化它。

在我的程序中，對象總是未定義在視圖控制器中，視圖本身與Plunker示例相反。

在Plunker示例中，它僅在第一個傳遞事件（第二個指令單擊事件工作正常）上未在控制器上定義。

• 我不知道爲什麼我在簡單的Plunker模擬和我的海量代碼中得到2個不同的結果，我希望兩種情況都是同一個邏輯問題的兩種不同結果。
• 同樣歡迎通過事件函數傳遞對象作爲參數的解決方案。

HTML

<pick-er get-obj-d="getObj()" obj-d="obj"></pick-er> 

視圖 - 控制器

function mainController($scope) 
{ 
    $scope.test = "work"; 
    $scope.getObj = function(){ 
     $scope.test = $scope.obj; 
    } 
} 

指令：

function PickerDirective() 
{ 
    return { 
     restrict: 'E', 
     scope: // isolated scope 
     { 
      obj : '=objD', 
      getObj: '&getObjD' 
     }, 
     controller: DirectiveController, 
     template:`<div ng-repeat="item in many"> 
         <button ng-click="sendObj()"> 
          Click on me to send Object {{item.num}} 
         </button> 
        </div>` 
    }; 


    function DirectiveController($scope, $element) 
    { 
     $scope.many =[{"num":1,}]; 
     $scope.sendObj = function() { 
      $scope.obj = {"a":1,"b":2, "c":3}; 
      $scope.getObj(); 
     } 
    } 
} 

Answer 1

我你的情況下，會更加簡單易用的事件，看看這個Plunker：

https://plnkr.co/edit/bFYDfhTqaUo8xhzSz0qH?p=preview

主控制器

function mainController($scope) 
{ 
console.log("mainCTRL ran") 
$scope.test = "work"; 
    $scope.$on('newObj', function (event, obj) { 
    $scope.obj = obj; 
    $scope.test = obj; 
    }); 
} 

指令控制器

function DirectiveController($scope, $element) 
    { 
    $scope.many =[{"num":1,}] 
     $scope.sendObj = function() { 
      $scope.$emit('newObj', {"a":1,"b":2, "c":3}) 
     } 
    } 

    return { 
     restrict: 'E', 
     controller: DirectiveController, 
     template:'<div ng-repeat="item in many"><button ng-click="sendObj()">Click on me to send Object {{item.num}}</button></div>' 
    }