CODEWITHSUNDEEP
angularjs
Michael
Michael

Reputation: 13616

Why I get Expression 'undefined' error in my directive link function?

Here the directive definition:

  (function () {
      "use strict";

    angular.module("damageEvent").directive("sitesDamage", ["damageEventServices", sitesDamage]);

    function sitesDamage(damageEventServices) {
        var directive = {
            restrict: "E",
            scope: {
                sitesDamagesList:'=',
                region: "=",
                contractid: "=",
                frequencyid: "="
            },
            templateUrl: "app/damageEvent/templates/sitesDamage.tmpl.html",
            controller: "sitesDamageController",
            controllerAs: "list",
            link: function (scope, elem, attr) {
                return damageEventServices.getSitesDamages()
                    .then(function (result) {
                        scope.sitesDamagesList = result.data;
                    });
            }
        }

        return directive;
    }
})();

In link function in this row:

 scope.sitesDamagesList = result.data;

I get this error:

Error: [$compile:nonassign] Expression 'undefined' in attribute 'sitesDamagesList' used with directive 'sitesDamage' is non-assignable!

Any idea why I get this error?

Upvotes: 0

Views: 67

Answers (1)

Yury Tarabanko
Yury Tarabanko

Reputation: 45121

It seems you are not passing required attributes when using directive.

<sitesDamage sitesDamagesList="something"></sitesDamage>

If your attributes are optional use =?

scope: {
   sitesDamagesList:'=?'
   ...
},

Optional attributes should be marked as such with a question mark: =? or =?attr. If the binding expression is non-assignable, or if the attribute isn't optional and doesn't exist, an exception ($compile:nonassign) will be thrown upon discovering changes to the local value, since it will be impossible to sync them back to the parent scope

Upvotes: 2

Related Questions