將數據從控制器傳遞到指令的鏈接？

在我的控制器：將數據從控制器傳遞到指令的鏈接？

myApp.controller('homeCtrl', function($scope, $rootScope, $state, 'red'; 
    $rootScope.$on('new_story', function(event, data) { 
     $scope.cardObj = {key:'value'}; 
    }); 
});

在我的HTML：

<div clickmeee ></div> 
<div id="feedContainer" card='{{cardObj}}'> </div>

在我的指令：

myApp.directive('clickmeee', function($compile, $rootScope) { 

      return { 
       restrict: 'A', 
       scope: { 
        card: '@' 
       }, 
       link: function(scope, element, attrs) { 
        element.bind('click', function() {    
          scope.$watch('card', function(newVal, oldVal) { 
           alert(scope.card); 
          });        
          }); 
         } 
        }; 
       });

如何從控制器數據傳遞到這個指令。我編譯一些html並將其預先添加到div中。所有這些都被整理出來了，但我需要一些來自我試圖通過的對象的數據。

任何幫助？

來源

2015-12-28 Leonardo Da Codinchi

您的範圍屬性名爲'card'。但是你正在觀看和提醒'cardObj'。 –

你不應該把觀察者點擊事件..在元素點擊多個觀察者將被添加.. –

你看過'放射'和'$廣播'？ – PierreDuc

有在你的代碼的幾個問題：

你定義了一個名爲「卡」 scope屬性，但是你用cardObj代替
您使用的手錶是完全不必要的。更糟糕的是：每次單擊元素時都會創建一個新手錶
您沒有在clickmeee元素上定義任何card屬性。相反，您將它放在另一個元素上，該元素不適用該指令。
您正在通過'@'傳遞屬性。這樣的作品，但如果您發出將在控制範圍內初始化cardObj

這裏事件的指令將收到一個字符串，包含JSONified對象，而不是你不showming我們對象本身

是一個plunkr顯示您的代碼的工作版本。

此外，請注意，使用bind('click')是一個壞主意。你最好在你的指令中有一個模板，並在模板中使用ng-click，或者根本不使用指令，直接使用ng直接單擊div元素。

來源

2015-12-28 08:49:07

這很棒！謝謝。會盡量挖一點 –

-1

你應該看card對象：

myApp.directive('clickmeee', function() { 

    return { 
     restrict: 'A', 
     scope: { 
      card: '@' 
     }, 
     link: function(scope, element, attrs) { 
      scope.$watch('card', function(value) { 
       console.log(value); 
      });   
     } 
    }; 
});

和：

<div clickmeee id="feedContainer" card='{{cardObj}}'> </div>

每當控制器改變cardObj，該指令對card手錶被觸發：

$scope.$apply(function() { 
    $scope.cardObj = "test"; 
}

來源

2015-12-28 07:45:18

我已經試過..給出了未定義。 –

也把ng-model。 –

對不起，您沒有注意到您首先綁定了點擊事件。更新了我的答案。 –

壞新聞。你做錯了所有的方式。

首先

card='{{cardObj}}' >

這一個應該被放在

<div clickmeee ></div>

所以，你可以把它作爲綁定範圍變量在你的指令登記

其次

如果你設法使用「@」語法

card: '@'

它會變成你的輸入字符串，而不是一個綁定範圍。改用'='。

最終

你不需要在這裏使用的手錶：

scope.$watch('card', function(newVal, oldVal) { 
    alert(newVal); 
});

因爲scope.card通過 '=' 連接器綁定。只需簡單使用警報（scope.card）。（需要警告你，提醒一個對象不是一個好主意）

我已經在這裏試過你的代碼：plunker。使用cardObj作爲字符串更改了一點點，以便於演示。它與你的工作相匹配嗎？

來源

2015-12-28 08:17:46 Quy

嘿，thx的答案。 –

將數據從控制器傳遞到指令的鏈接？

回答

相關問題