javascript - 在 Angular 中刷新指令

Question

我是 Angular 的新手，所以我不确定“刷新指令”的措辞是否正确。我正在 Angular 中构建测验并使用 djds4rce's angular-socialshare显示 Twitter 按钮。

编辑:抱歉之前缺少信息。这是更多代码:

edit edit:好的，这显然与 angular-socialshare 插件或 Twitter 按钮有关。当我对 Twitter 按钮执行此操作时:

<a twitter data-text="{{score}}"></a>

我在 Chrome 的开发者工具中看到它正确显示了用户的分数。但是，当我单击链接时，文本突然变回“0”。

HTML

我从一个 api 得到一个列表。该列表的每个元素(我称它为首要元素)都有一个名称和一个“正确”属性。

<button ng-click="validateClick(premier, $index)" 
class="btn btn-default btn-game" 
data-correct="@{{premier.correct}}" 
ng-class="{'disabled btn-danger': premier.isPremier, 'disabled btn-success': premier.isRandom}" 
ng-repeat="premier in premiers" 
ng-disabled="gameOver" 
ng-bind="premier.name">

然后我为用户显示分数:

<span class="score" ng-bind="score"> </span>/70

JavaScript

在我的 Angular Controller 中，我有一个名为 score 的变量

premierApp.controller('premierController', function ($scope, $http) {

$scope.score = 0;

//so if this correct value = "premier", Game Over! if it = "random", then the user gets a point
$scope.validateClick = function (premier, index) {
    if (premier.correct == "premier") {
        premier.isPremier = true;
        $scope.gameOver = true;
        $scope.stopGame();
    } else {
        premier.isRandom = true;
        $scope.score++;
    }
}

我正在使用一个指令来显示一个推特按钮，这样用户就可以在推特上发布他的分数:

指令:

premierApp.directive('tweetbutton', function() {
    return {
        templateUrl: 'html_templates/premiers_tweetbutton.html',
    };
});

模板网址是这样的:

<a twitter
    data-lang="en"
    data-size="medium"
    data-text="{{score}}">
</a>

现在推特按钮的文本(数据文本)仍然是“0”(我在 Controller 中声明变量时的标准值)。

如何更新指令以显示我的应用计算的新分数？

Answer 1

你可能需要做:

$scope.$apply() 

在你的 Controller 函数中，但如果我能看到一个 plunkr 或更多有帮助的代码

做一个plunkr，让我们看看一切，我想知道你的指令附加到哪个元素。如果该 $scope 的值发生变化，指令将自动“刷新”。再次，做一个 plunkr 会有所帮助，我不知道一切都在寻找你。

更新

http://plnkr.co/edit/Y6LSXhOV1r8c4HQeDq0L?p=preview

试试这个:

您的指令:

premierApp.directive('tweetbutton', function($compile) {
   return {
       scope: { score: "@score" },
       templateUrl: 'premiers_tweetbutton.html'
   };
});

在 View 中

<div tweetbutton score="{{score}}"></div>