ng-href doesn't work as expected

Question

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.

Answer 1

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.