1

Could you please explain why method 1 (binding to property) does not work, while method 2 (binding to function return value) does?

Including relevant code here. Please post a comment if you require any additional code.

function MyController(myService) {
    // Method 1: A property
    this.backgroundImagePath = login.backgroundImagePath;

    // Method 2: A function
    this.getBackgroundImagePath = function () {
        return login.backgroundImagePath;
    };
}

Then in my HTML code, I have:

<!-- Does not work -->
<img data-ng-src="{{ myController.backgroundImagePath }}" />

<!-- Works as expected -->
<img data-ng-src="{{ myController.getBackgroundImagePath() }}" />
7
  • The error must be somewhere else, since both methods work in this Plunker. Can you add your own Plunker? Commented Sep 29, 2015 at 13:24
  • Because of time. The value of login.backgroundImagePath is not the same when it's read. Commented Sep 29, 2015 at 13:25
  • @zeroflagL: Thanks! So I understand that when login.backgroundImagePath is initially read, that it will not have the updated value. However, is there a way to have the value updated whenever login.backgroundImagePath changes? Or are functions the correct way to handle this Commented Sep 29, 2015 at 13:33
  • Just found this SO answer, that should help! :) Commented Sep 29, 2015 at 13:37
  • You can add a watcher for login.backgroundImagePath. You can also define a getter, which basically works like getBackgroundImagePath in the background, but login.backgroundImagePath is still a property. Commented Sep 29, 2015 at 13:38

0

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.