how to use angular js scope variable in html

Question

I want to pass value of scope variable returned from controller in html window.open, but the problem is i get some garbage value, please see the code below.

<header>
    <span class="item-title">{{x.name}}</span>
    <span class="list-item-note-sendmoney1" onclick="window.open('tel:{{x.phone}}', '_system')"><ons-icon icon="ion-android-call"></ons-icon></span>
</header>
<p class="swipe-item-desc">{{x.phone}}</p>

I want to pass {{x.phone}} to window.open('tel:') function.

Answer 1

Don't use onclick. Use ng-click. And put the JS code in the controller:

ng-click="openWindow()"

and in the controller

$scope.openWindow = function() {
    window.open('tel:' + $scope.x.phone, '_system');
}