Question

我正在使用angular开发扩展。当控制器加载时，我需要从本地存储中收取信息：

var app = angular.module("Logins");

app.controller("LoginsCtrl", function($scope) {

    chrome.runtime.sendMessage({message: "get_data"}, function(response) {
        $scope.myText = response.value;
    });
});

在视图中非常简单：

{{ myText }}

如果我使用默认值初始化该值，则可以正确显示它，当我检查console.log时，该值是正确的。但是视图没有刷新。

我已经看到了一些关于tick（），detectChanges（）的问题，但我不明白如何使用这些函数，一直对我说该函数未定义。

你能帮我吗？

谢谢

此致

马丁

Answer 1

这是我的完整代码：

popup.html：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />

<script src="angular-1.6.9.min.js"></script>
<script src="controller.js"></script>
</head>
<body>
    <div ng-app="Logins" ng-controller="LoginsCtrl">

        {{ myText }}

    </div>
</body>
</html>

这是controller.js：

var app = angular.module("Logins");

app.controller("LoginsCtrl", function($scope) {
    var getData = function(response, sender, sendResponse) {
        $scope.myText = response.value;
        console.log($scope.myText);
    };
    chrome.runtime.sendMessage({message: "get_data"}, getData.bind(this));
});

这是background.js：

chrome.runtime.onMessage.addListener( function(request,sender,sendResponse) {
    if(request.message === "get_data") {
        sendResponse({value:"toto"});
    } else {
        console.log('Message unknown');
    }
});

这是非常基本的内容。

此致

马丁

Answer 2

我找到了答案，但我犯了一个错误： $ scope.apply（）奥利乌德 $ scope。$ apply（）

Angular / Chrome扩展-收到回调时更新视图

2 个答案: