1

I am trying to add edit functionality to my app. In one view, I have a button that brings you to the edit page.

<button ng-click="editMission(selectedMission.key)">Edit Mission</button> 

The value selectedMission.key is used to determine what to initialize the edit page's form data with.

In the controller the function looks like this:

  $scope.editMission = function(key){
    $location.path('/edit');
  }

On the edit page I have:

<div data-ng-init="editInit()">

And in my controller I have:

      $scope.editInit = function(){
        var query = myDataRef.orderByKey();
        query.on("child_added", function(missionSnapshot){
          if (missionSnapshot.key()==key){
           ...
          }
        });    
      } 

How can I run the initialize function based on the key value from editMission. Should I use some getter/setter approach with a global key variable? I tried just placing the editInit code in editMission but the form data does not populate on view load.

6
  • Can't you set scope variables with editMission() and then bind those variables to the form in the view (ng-model)? Commented Feb 21, 2016 at 19:18
  • Are you using ngRoute or ui-route? Commented Feb 21, 2016 at 19:41
  • @drakyoko It is possible to do that, but the fields and radio buttons do not visually change to the variable values. Commented Feb 21, 2016 at 19:43
  • @georgeawg I haven't used either, not sure what they are. Commented Feb 21, 2016 at 19:43
  • I recomend you use AngularFire.AngularFire is the officially supported AngularJS binding for Firebase. It is integrated with the AngularJS $q service. Commented Feb 21, 2016 at 20:01

1 Answer 1

0

Common practice is to use a service to share variables between views/controllers.

So in your case you would use the getter/setter approach as you suspected. I don't know what exactly you're trying to do, but the service in your case would look something like this:

app.factory('missionKeyService', function() {

    var currentMission= {};            

    return {

        setMissionKey: function(missionKey) {
            currentMission.key = missionKey;
        },

        getMissionKey: function() {
            return currentMission.key;
        }
    }
})

And in your controller1:

//include 'missionKeyService' in your controller function params 
$scope.editMission = function(key) {
    missionKeyService.setMissionKey(key);
    $location.path('/edit');
}

And controller2:

//include 'missionKeyService' in your controller function params
$scope.editInit = function() {
       var currentKey = missionKeyService.getMissionKey();
       //do something with this key
       ...
}
Sign up to request clarification or add additional context in comments.

2 Comments

You are just missing one closed curly bracket to close the return
Sorry yeah, was coding on here on the fly. Edited my answer. Also removed the extra bracket bits in controller2 (doesn't apply to he editInit function).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.