Question

我想将一些数据传递给我的指令，以便我可以将其用作我服务的参数。我尝试了一些我不确定的东西。我不知道。我需要知道如何将数据传递给指令，以便我可以使用它。在这里，我想传递ID，以便我可以在工厂中使用它 JAVASCRIPT 文件：

  var classificationViewModule = angular.module('ald.classificationview',[]);

    classificationViewModule.factory('classificationAPI',function(){
        return {
            getClassification:function($http,artifactId){
                //TODO add URL
                var url = "Classification/getInfo?artifactId="+artifactId
                return $http({
                    method: 'GET',
                    url: url
                });
            }
        };
    });

classificationViewModule.directive('classificationview', function () {
    return {
        restrict: 'EA',
        scope: {},
        replace: true,
        link: function ($scope, element, attributes) {     
            $scope.artifactId = attribute["artifactId"];

        },
        controller: function ($scope, $http, classificationAPI) {

            classificationAPI.getClassification($http).success(function(data,status){               
                //TODO
                $scope.artifactClassification = data;
            }).error(function(data,status){
                if (404==status){
                    alert("no text");
                } else {
                    alert("bad stuff!");
                }
            });            
        },
        //TODO add template url
        templateUrl: "classificationviewer.html"
    };
});

在 HTML 文件中。当我调用该指令时，它应该传递这个值，该值可以在工厂方法中用于请求数据：

<classificationview artifactId="6450"/>

Answer 1

这应该有助于调试：

classificationViewModule.directive('classificationview', function () {
    return {
        restrict: 'EA',
        scope: {
             artifactId: "@" // add it to scope with two way binding
        },
        replace: true,
        link: function ($scope, element, attributes) {     
            //$scope.artifactId = attributes["artifactId"]; // is this defined?

            $scope.artifactId = attributes.artifactId;
        },
        controller: function ($scope, $attrs, $http, classificationAPI) {
            // console.log($scope.artifactId, "...", scope.artifactId); // what's this output
            //how about
            $scope.artifactId = $attrs.artifactId;
            setTimeout(function () {
                console.log($scope.artifactId, '...', $attrs.artifactId); // this should return the actual value...
            }, 1000);

            classificationAPI.getClassification($http).success(function(data,status){               
                //TODO
                $scope.artifactClassification = data;
            }).error(function(data,status){
                if (404==status){
                    alert("no text");
                } else {
                    alert("bad stuff!");
                }
            });            
        },
        //TODO add template url
        templateUrl: "classificationviewer.html"
    };
});

更新，只是注意到，HTML应该带有连字符：

 <classificationview artifact-id="6450"/>

而不是

<classificationview artifactId="'6450'"/> <!-- string -->

解释

 // attribute in JS: myAttributeName
 // attribute in HTML: my-attribute-name

将数据传递到指令Angular JS的最简单方法

1 个答案: