Question

我们说我有 html ：

<div ng-controller="MyCtrl">    
    <br>
    <my-directive my-name="name">Hello, {{name}}!</my-directive>
</div>

使用这个简单的控制器：

myApp.controller('MyCtrl', function ($scope) {
    $scope.name = 'Superhero';
});

我有一个指令，我希望使用'name'更改require，如下所示：

myApp.directive('myDirective', function($timeout) {
var controller = ['$scope', function ($scope) {
    $scope.name = "Steve";
}];
    return {
        restrict: 'EA',
        require: 'myName',
        controller: controller,
        link: function(scope, element, attrs, TheCtrl) {
            TheCtrl.$render = function() {
                $timeout(function() {
                    TheCtrl.$setViewValue('StackOverflow');  
                }, 2000);                
            };
        }
    };
});

但抛出：

Error: No controller: myName

以下是fiddle

但是如果我使用 ng-model 来实现它，那就行了。看看这个其他fiddle

我有read如果你在指令中使用'require'，你需要有一个控制器。

所以：

我做的是错的？它不是这样的吗？我需要做其他任何事情吗？

Answer 1

有一个错字。您的控制器名称是MyCtrl而不是myName

Answer 2

好吧我终于得到了它。

重要的是，我正在尝试做的事情是：'使用控制器的指令之间的通信。我找到了implementation来解释这一点，并帮了我很多忙：

观点：

my-directive

如上所述，有两个指令：my-name和my-directive。我将使用my-name从require指令的控制器内部myApp.directive('myDirective', function($timeout) { return { require: 'myName', link: function(scope, element, attrs, myNameCtrl) { $timeout(function() { myNameCtrl.setName("Steve"); }, 9000); } // End of link }; // return });调用一个函数。

<强> myDirective：

myApp.directive('myName', function($timeout) {
    var controller = ['$scope', function ($scope) {
        // As I tried, this function can be only accessed from 'link' inside this directive
        $scope.setName = function(name) {
            $scope.name = name;
            console.log("Inside $scope.setName defined in the directive myName");
        };

        // As I tried, this function can accessed from inside/outside of this directive
        this.setName = function(name) {
            $scope.name = name;
            console.log("Inside this.setName defined in the directive myName");
        };
    }];

    return {
        controller: controller,
        link: function(scope, element, attrs, localCtrl) {
            $timeout(function() {
                localCtrl.setName("Charles");
            }, 3000);
            $timeout(function() {
                scope.setName("David");
            }, 6000);
        } // End of link function
    };
});

<强> MYNAME：

public class Category
{
    public int CategoryId { get; set; }
    public string CategoryName { get; set; }
    public ICollection<Product> Products { get; set; }  
}

public class Product
{
    public int ProductId { get; set; }
    public string Name { get; set; }
    public decimal Price { get; set; }
    public int CategoryId { get; set; }
    public Category Category { get; set; }
}

有趣并且像魅力一样工作。如果你想尝试一下，这是article。

此外，您可以使用事件在指令之间进行通信。请在此处阅读fiddle。

定义我自己的＆＃39;要求＆＃39;在指令上，但抛出错误 - AngularJs

2 个答案: