0

I have AngularJS v1.3.1 on the project. I have an anchor tag in my template:

<a class="btn btn-primary" 
   ng-href="#!/database/{{home.uuidSelectedDatabase}}/segments?{{goToSegmentsUrlQuery}}">
   <i ng-if="!goToSegmentsUrlQuery" 
      class="icon-refresh icon-white pm-icon-spin pm-button-icon"></i>
   <span ng-i18next="segments:set-operations.form.button.go-to-segments"></span>
</a>

I expect this anchor to have empty href until both home.uuidSelectedDatabase and goToSegmentsUrlQuery are defined in $scope.

However, Angular doesn't wait until goToSegmentsUrlQuery is defined, and for some time I have a link ending with /segments?, which is not what I need.

Mikhail Batcer
  • 1,938
  • 7
  • 37
  • 57
  • 1
    You need to at least define it in the scope; `$scope.goToSegmentsUrlQuery = ""`, otherwise the object property will be `undefined` and Angular can't watch for changes. This means that when you do define it later on, Angular isn't watching the property because it was initially not defined at all. – Sven Oct 19 '17 at 07:14
  • 1
    Can you please post your `controller`'s code? – David R Oct 19 '17 at 07:15
  • @Svenskunganka That doesn't help. But I've solved the issue, see my answer. – Mikhail Batcer Oct 19 '17 at 07:39

1 Answers1

0

I solved the issue by throwing everything out of ng-href value except one curly-braced value:

<a class="btn btn-primary" ng-href="{{goToSegmentsUrl}}">
...

And it worked without pre-defining $scope.goToSegmentsUrl = '' in controller.

Mikhail Batcer
  • 1,938
  • 7
  • 37
  • 57