Question

我想在AngularJS中声明我自己的指令，它将属性作为一个文件的字符串源，它必须加载然后以某种方式修改并显示。

我有一个AngularJS指令和过滤器，定义如下 -

app.directive("customTag", function ($compile) {
    return {
        restrict: 'E',
        require: 'src',
        scope: {
            value: "=src"
        },
        template: '<div ng-bind-html-unsafe="value | myFilter"></div>',
        replace: true
    };
});
app.filter('myFilter', function () {
    return function (value) {
        $http({
            url: value,
            method: 'GET'
        }).success(function (data, status, headers, config) {
            value = data; // gets a string value
        }).error(function (data, status, headers, config) {
            value = "Error getting content";
        });
        return ModifyString(value);
    };
});

相应的HTML是 -

<customTag src="/test.txt"></customTag>

但是，这给了我一个错误，说明在范围中没有定义$http。我该如何解决这个问题？

此外，我认为我会遇到$http调用将是异步调用的问题，因此在读取文件后，过滤器将不会返回正确的值。

Answer 1

您需要在过滤器提供程序中注入$http提供程序：

app.filter('myFilter', function ($http) {...

除此之外，你应该重新考虑你的逻辑。过滤器不应该处理服务器和承诺。这就是服务和指令的用途。

AngularJS中的指令，过滤器和异步调用

1 个答案: