Question

我正在努力将数据从我的模型传递到指令，几乎不知道如何。我是AngularJS的新手：）。

我的标记如下。目前见证了两个问题：

1）范围。无论我输入什么，$ parent.companyName总是空白的？我已声明一个空值，否则它是undefined，这似乎是一个反模式。

2）即使我（1）工作，它也依赖于我给出它的模型的布局，因为$ parent。如何将字符串传递给指令？

我有一个观点：

<ion-view>
    <ion-header-bar class="bar-royal">
        <h1 class="title">{{ registerTitle }}</h1>
    </ion-header-bar>
    <ion-content>
        <div class="list list-inset">
            <label>
                {{ registerInfoLabel }}
            </label>
            <label class="item item-input">
                <input type="text" placeholder="{{ companyNameLabel }}" ng-model="companyName">
            </label>
            <label>
                <button class="button button-block button-royal" register-app>
                    {{ registerLabel }}
                </button>
            </label>
        </div>
    </ion-content>
</ion-view>

控制器：

angular.module('app')

    .controller('RegisterController', ['$scope', '$appI18n', function ($scope, $appI18n) {
        $scope.registerTitle = $appI18n.RegisterTitle;
        $scope.registerLabel = $appI18n.RegisterLabel;
        $scope.companyNameLabel = $appI18n.CompanyName;
        $scope.registerInfoLabel = $appI18n.RegisterInfoLabel;

        $scope.companyName = '';
    }]);

指令：

angular.module('app')

    .directive('registerApp', ['RegisterService', function (RegisterService) {
        return {
            restrict: 'AE',
            link: function (scope, element, attrs) {
                element.bind('click', function () {
                    alert(scope.$parent.companyName);
                })
            }
        }
    }]);

Answer 1

您可以使用属性将字符串发送到指令。如果您只有一个参数要发送，那么您可以像这样使用指令本身：

<div register-app="companyName"></div>

并将其添加到指令范围：

scope: { registerApp : '=' },

然后它将在您的范围内提供：

link: function (scope, element, attrs) {
      console.log("cname ",scope.registerApp);
}

这是一个有效的例子：http://jsfiddle.net/kgwkf02c/

或你可以使用它自己的属性发送它（如果你想发送多个值，这非常有用）：

<div register-app cname="companyName"></div>

指令看起来像：

scope: { cname : '=' },
link: function (scope, element, attrs) {
          console.log("cname ",scope.cname);
}

以下是该版本：http://jsfiddle.net/kgwkf02c/1/

将$ scope变量传递给指令

1 个答案: