Search code examples
javascriptangularjstwitter-bootstrapbootstrap-modalui.bootstrap

angularJS resolve: in controller "Cannot read property 'goals' of undefined


This is my first question on stackoverflow. ( I know I struggled a lot with the quotes..) I am stuck with this problem where a snippet of the following code leaves me with the following error:

TypeError: Cannot read property 'goals' of undefined
at $scope.addValue.$modal.open.resolve.goals (app.js:59) at Object.invoke (angular.js:3762) at ui-bootstrap-tpls-0.12.1.js:2118 at Object.forEach (angular.js:329) at getResolvePromises (ui-bootstrap-tpls-0.12.1.js:2116) at Object.$modalProvider.$get.$modal.open (ui-bootstrap-tpls-0.12.1.js:2151) at Scope.$scope.addValue (app.js:53) at Parser.functionCall (angular.js:10294) at angular.js:18229 at Scope.$get.Scope.$eval (angular.js:12075)

'goals' in my code is the equivalent of 'items' in the 'inspired by" code.

This message seems to come from the ctrlAddValue controller which includes 'goals' reference: function($scope, $modalInstance, goals)

Thanks for any help!

THe culprit:

app.controller("ctrlCtx", function ($scope, $state, $stateParams, $modal,     $window) {

$scope.goals = "A good goal";

     $scope.addValue = function (size, $scope) {
        var modalInstance = $modal.open({
            templateUrl: 'templates/addValue.html',
            size: "lg",
            controller: "ctrlAddValue",
            resolve: {
                goals: function () {
                    return $scope.goals;
                }
            }
        })
        modalInstance.result.then(
             function (selectedItem) {

              }, 
              function () {

              });
     }; });

This is the 'ctrlAddValue' controller code.

app.controller('ctrlAddValue', function ($scope, $state, $modalInstance, goals) {

$scope.addValue = function(){

    $modalInstance.close();
};

$scope.cancel = function () {
    $modalInstance.dismiss();
 };

 });

This is based on the ui.bootstrap demo for modal.


Solution

  • app.controller("ctrlCtx", function ($scope, $state, $stateParams, $modal,     $window) {
    
    $scope.goals = "A good goal";
    
         $scope.addValue = function (size, $scope) {
    

    you are passing $scope as a local parameter and probably calling this function like $scope.addValue(something); making the local $scope undefined.

    remove the $scope parameter from your addValue function.