{{}} in ng-click & ng-repeat [duplicate]

This question already has an answer here:

Why mixing interpolation and expressions is bad practice

2 answers

This is the code of my HTML

<div id="container" ng-app="containArea" ng-controller="myCtrl">

<div id="sidebody" class="block">

    <button 

      ng-repeat="shopli in shopName" 

      ng-click="openurl({{'''+shopli.url+'''}})" 

      class="btn_shopList">

      {{shopli.name}}

    </button>

</div>

 ........

</div>

And the JS here

var app = angular.module('containArea', );

app.controller('myCtrl', function($scope) {

    $scope.shopName=[

        {

          "name":'momo購物網',

          "url":'https://buyforfun.biz/2LvEY'

        },

        {

          "name":'金石堂書局',

          "url":'https://joymall.co/2MX4o'

        }

    ]; 

    $scope.openurl = function(url){

         window.open(url, '_blank');

    }

});

The {{shopli.name}} output correctly

But if I click the button , nothing happened

Could anyone help me to fix it

asked Nov 22 '18 at 11:35

張睿玹

marked as duplicate by georgeawg angularjs
Users with the angularjs badge can single-handedly close angularjs questions as duplicates and reopen them as needed.

StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;

$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');

$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Nov 22 '18 at 16:11

This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.

1

why can't you send ng-click="openurl(shopli.url)" directly?

– Shaheryar.Akram
Nov 22 '18 at 11:48

It works,thank you

– 張睿玹
Nov 22 '18 at 11:53

glad to be of help! cheers!

– Shaheryar.Akram
Nov 22 '18 at 11:54

add a comment |

This question already has an answer here:

Why mixing interpolation and expressions is bad practice

2 answers

This is the code of my HTML

<div id="container" ng-app="containArea" ng-controller="myCtrl">

<div id="sidebody" class="block">

    <button 

      ng-repeat="shopli in shopName" 

      ng-click="openurl({{'''+shopli.url+'''}})" 

      class="btn_shopList">

      {{shopli.name}}

    </button>

</div>

 ........

</div>

And the JS here

var app = angular.module('containArea', );

app.controller('myCtrl', function($scope) {

    $scope.shopName=[

        {

          "name":'momo購物網',

          "url":'https://buyforfun.biz/2LvEY'

        },

        {

          "name":'金石堂書局',

          "url":'https://joymall.co/2MX4o'

        }

    ]; 

    $scope.openurl = function(url){

         window.open(url, '_blank');

    }

});

The {{shopli.name}} output correctly

But if I click the button , nothing happened

Could anyone help me to fix it

asked Nov 22 '18 at 11:35

張睿玹

marked as duplicate by georgeawg angularjs
Users with the angularjs badge can single-handedly close angularjs questions as duplicates and reopen them as needed.

StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;

$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');

$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Nov 22 '18 at 16:11

This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.

1

why can't you send ng-click="openurl(shopli.url)" directly?

– Shaheryar.Akram
Nov 22 '18 at 11:48

It works,thank you

– 張睿玹
Nov 22 '18 at 11:53

glad to be of help! cheers!

– Shaheryar.Akram
Nov 22 '18 at 11:54

add a comment |

This question already has an answer here:

Why mixing interpolation and expressions is bad practice

2 answers

This is the code of my HTML

<div id="container" ng-app="containArea" ng-controller="myCtrl">

<div id="sidebody" class="block">

    <button 

      ng-repeat="shopli in shopName" 

      ng-click="openurl({{'''+shopli.url+'''}})" 

      class="btn_shopList">

      {{shopli.name}}

    </button>

</div>

 ........

</div>

And the JS here

var app = angular.module('containArea', );

app.controller('myCtrl', function($scope) {

    $scope.shopName=[

        {

          "name":'momo購物網',

          "url":'https://buyforfun.biz/2LvEY'

        },

        {

          "name":'金石堂書局',

          "url":'https://joymall.co/2MX4o'

        }

    ]; 

    $scope.openurl = function(url){

         window.open(url, '_blank');

    }

});

The {{shopli.name}} output correctly

But if I click the button , nothing happened

Could anyone help me to fix it

asked Nov 22 '18 at 11:35

張睿玹

This question already has an answer here:

Why mixing interpolation and expressions is bad practice

2 answers

This is the code of my HTML

<div id="container" ng-app="containArea" ng-controller="myCtrl">

<div id="sidebody" class="block">

    <button 

      ng-repeat="shopli in shopName" 

      ng-click="openurl({{'''+shopli.url+'''}})" 

      class="btn_shopList">

      {{shopli.name}}

    </button>

</div>

 ........

</div>

And the JS here

var app = angular.module('containArea', );

app.controller('myCtrl', function($scope) {

    $scope.shopName=[

        {

          "name":'momo購物網',

          "url":'https://buyforfun.biz/2LvEY'

        },

        {

          "name":'金石堂書局',

          "url":'https://joymall.co/2MX4o'

        }

    ]; 

    $scope.openurl = function(url){

         window.open(url, '_blank');

    }

});

The {{shopli.name}} output correctly

But if I click the button , nothing happened

Could anyone help me to fix it

This question already has an answer here:

Why mixing interpolation and expressions is bad practice

2 answers

angularjs angularjs-ng-repeat angularjs-ng-click

asked Nov 22 '18 at 11:35

張睿玹

asked Nov 22 '18 at 11:35

張睿玹

asked Nov 22 '18 at 11:35

張睿玹

asked Nov 22 '18 at 11:35

張睿玹

asked Nov 22 '18 at 11:35

張睿玹

marked as duplicate by georgeawg angularjs
Users with the angularjs badge can single-handedly close angularjs questions as duplicates and reopen them as needed.

StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;

$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');

$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Nov 22 '18 at 16:11

This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.

marked as duplicate by georgeawg angularjs
Users with the angularjs badge can single-handedly close angularjs questions as duplicates and reopen them as needed.

StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;

$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');

$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Nov 22 '18 at 16:11

This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.

1

why can't you send ng-click="openurl(shopli.url)" directly?

– Shaheryar.Akram
Nov 22 '18 at 11:48

It works,thank you

– 張睿玹
Nov 22 '18 at 11:53

glad to be of help! cheers!

– Shaheryar.Akram
Nov 22 '18 at 11:54

add a comment |

1

why can't you send ng-click="openurl(shopli.url)" directly?

– Shaheryar.Akram
Nov 22 '18 at 11:48

It works,thank you

– 張睿玹
Nov 22 '18 at 11:53

glad to be of help! cheers!

– Shaheryar.Akram
Nov 22 '18 at 11:54

why can't you send ng-click="openurl(shopli.url)" directly?

– Shaheryar.Akram
Nov 22 '18 at 11:48

It works,thank you

– 張睿玹
Nov 22 '18 at 11:53

glad to be of help! cheers!

– Shaheryar.Akram
Nov 22 '18 at 11:54

add a comment |

1 Answer
1

active

oldest

votes

Use the value directly in ng-click function instead of using angular expression {{}}.

ng-click="openurl('''+shopli.url+''')"

var app = angular.module('containArea', );

app.controller('myCtrl', function($scope) {

  $scope.shopName = [{

      "name": 'momo購物網',

      "url": 'https://buyforfun.biz/2LvEY'

    },

    {

      "name": '金石堂書局',

      "url": 'https://joymall.co/2MX4o'

    }

  ];

  $scope.openurl = function(url) {

    console.log(url);

  }

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div id="container" ng-app="containArea" ng-controller="myCtrl">

  <div id="sidebody" class="block">

    <button ng-repeat="shopli in shopName" ng-click="openurl(shopli.url)" class="btn_shopList">

      {{shopli.name}}

    </button>

  </div>

</div>

edited Nov 22 '18 at 11:53

answered Nov 22 '18 at 11:36

Ankit Agarwal

24k52144

Still nothing happened

– 張睿玹
Nov 22 '18 at 11:43

Still nothing happened upload.cc/i1/2018/11/22/03c6WG.png

– 張睿玹
Nov 22 '18 at 11:49

@張睿玹 just use ng-click="openurl(shopli.url)" without quotes. That should work for windows.open.

– Ankit Agarwal
Nov 22 '18 at 11:53

@ Shaheryar.Akram @Ankit Agarwal Thanks a lot ,it work.😊

– 張睿玹
Nov 22 '18 at 11:56

@張睿玹 glad to help

– Ankit Agarwal
Nov 22 '18 at 11:57

add a comment |

1 Answer
1

active

oldest

votes

1 Answer
1

active

oldest

votes

Use the value directly in ng-click function instead of using angular expression {{}}.

ng-click="openurl('''+shopli.url+''')"

var app = angular.module('containArea', );

app.controller('myCtrl', function($scope) {

  $scope.shopName = [{

      "name": 'momo購物網',

      "url": 'https://buyforfun.biz/2LvEY'

    },

    {

      "name": '金石堂書局',

      "url": 'https://joymall.co/2MX4o'

    }

  ];

  $scope.openurl = function(url) {

    console.log(url);

  }

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div id="container" ng-app="containArea" ng-controller="myCtrl">

  <div id="sidebody" class="block">

    <button ng-repeat="shopli in shopName" ng-click="openurl(shopli.url)" class="btn_shopList">

      {{shopli.name}}

    </button>

  </div>

</div>

edited Nov 22 '18 at 11:53

answered Nov 22 '18 at 11:36

Ankit Agarwal

24k52144

Still nothing happened

– 張睿玹
Nov 22 '18 at 11:43

Still nothing happened upload.cc/i1/2018/11/22/03c6WG.png

– 張睿玹
Nov 22 '18 at 11:49

@張睿玹 just use ng-click="openurl(shopli.url)" without quotes. That should work for windows.open.

– Ankit Agarwal
Nov 22 '18 at 11:53

@ Shaheryar.Akram @Ankit Agarwal Thanks a lot ,it work.😊

– 張睿玹
Nov 22 '18 at 11:56

@張睿玹 glad to help

– Ankit Agarwal
Nov 22 '18 at 11:57

add a comment |

Use the value directly in ng-click function instead of using angular expression {{}}.

ng-click="openurl('''+shopli.url+''')"

var app = angular.module('containArea', );

app.controller('myCtrl', function($scope) {

  $scope.shopName = [{

      "name": 'momo購物網',

      "url": 'https://buyforfun.biz/2LvEY'

    },

    {

      "name": '金石堂書局',

      "url": 'https://joymall.co/2MX4o'

    }

  ];

  $scope.openurl = function(url) {

    console.log(url);

  }

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div id="container" ng-app="containArea" ng-controller="myCtrl">

  <div id="sidebody" class="block">

    <button ng-repeat="shopli in shopName" ng-click="openurl(shopli.url)" class="btn_shopList">

      {{shopli.name}}

    </button>

  </div>

</div>

edited Nov 22 '18 at 11:53

answered Nov 22 '18 at 11:36

Ankit Agarwal

24k52144

Still nothing happened

– 張睿玹
Nov 22 '18 at 11:43

Still nothing happened upload.cc/i1/2018/11/22/03c6WG.png

– 張睿玹
Nov 22 '18 at 11:49

@張睿玹 just use ng-click="openurl(shopli.url)" without quotes. That should work for windows.open.

– Ankit Agarwal
Nov 22 '18 at 11:53

@ Shaheryar.Akram @Ankit Agarwal Thanks a lot ,it work.😊

– 張睿玹
Nov 22 '18 at 11:56

@張睿玹 glad to help

– Ankit Agarwal
Nov 22 '18 at 11:57

add a comment |

Use the value directly in ng-click function instead of using angular expression {{}}.

ng-click="openurl('''+shopli.url+''')"

var app = angular.module('containArea', );

app.controller('myCtrl', function($scope) {

  $scope.shopName = [{

      "name": 'momo購物網',

      "url": 'https://buyforfun.biz/2LvEY'

    },

    {

      "name": '金石堂書局',

      "url": 'https://joymall.co/2MX4o'

    }

  ];

  $scope.openurl = function(url) {

    console.log(url);

  }

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div id="container" ng-app="containArea" ng-controller="myCtrl">

  <div id="sidebody" class="block">

    <button ng-repeat="shopli in shopName" ng-click="openurl(shopli.url)" class="btn_shopList">

      {{shopli.name}}

    </button>

  </div>

</div>

edited Nov 22 '18 at 11:53

answered Nov 22 '18 at 11:36

Ankit Agarwal

24k52144

Use the value directly in ng-click function instead of using angular expression {{}}.

ng-click="openurl('''+shopli.url+''')"

var app = angular.module('containArea', );

app.controller('myCtrl', function($scope) {

  $scope.shopName = [{

      "name": 'momo購物網',

      "url": 'https://buyforfun.biz/2LvEY'

    },

    {

      "name": '金石堂書局',

      "url": 'https://joymall.co/2MX4o'

    }

  ];

  $scope.openurl = function(url) {

    console.log(url);

  }

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div id="container" ng-app="containArea" ng-controller="myCtrl">

  <div id="sidebody" class="block">

    <button ng-repeat="shopli in shopName" ng-click="openurl(shopli.url)" class="btn_shopList">

      {{shopli.name}}

    </button>

  </div>

</div>

var app = angular.module('containArea', );

app.controller('myCtrl', function($scope) {

  $scope.shopName = [{

      "name": 'momo購物網',

      "url": 'https://buyforfun.biz/2LvEY'

    },

    {

      "name": '金石堂書局',

      "url": 'https://joymall.co/2MX4o'

    }

  ];

  $scope.openurl = function(url) {

    console.log(url);

  }

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div id="container" ng-app="containArea" ng-controller="myCtrl">

  <div id="sidebody" class="block">

    <button ng-repeat="shopli in shopName" ng-click="openurl(shopli.url)" class="btn_shopList">

      {{shopli.name}}

    </button>

  </div>

</div>

var app = angular.module('containArea', );

app.controller('myCtrl', function($scope) {

  $scope.shopName = [{

      "name": 'momo購物網',

      "url": 'https://buyforfun.biz/2LvEY'

    },

    {

      "name": '金石堂書局',

      "url": 'https://joymall.co/2MX4o'

    }

  ];

  $scope.openurl = function(url) {

    console.log(url);

  }

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div id="container" ng-app="containArea" ng-controller="myCtrl">

  <div id="sidebody" class="block">

    <button ng-repeat="shopli in shopName" ng-click="openurl(shopli.url)" class="btn_shopList">

      {{shopli.name}}

    </button>

  </div>

</div>

edited Nov 22 '18 at 11:53

answered Nov 22 '18 at 11:36

Ankit Agarwal

24k52144

edited Nov 22 '18 at 11:53

answered Nov 22 '18 at 11:36

Ankit Agarwal

24k52144

answered Nov 22 '18 at 11:36

Ankit Agarwal

24k52144

answered Nov 22 '18 at 11:36

Ankit Agarwal

24k52144

Still nothing happened

– 張睿玹
Nov 22 '18 at 11:43

Still nothing happened upload.cc/i1/2018/11/22/03c6WG.png

– 張睿玹
Nov 22 '18 at 11:49

@張睿玹 just use ng-click="openurl(shopli.url)" without quotes. That should work for windows.open.

– Ankit Agarwal
Nov 22 '18 at 11:53

@ Shaheryar.Akram @Ankit Agarwal Thanks a lot ,it work.😊

– 張睿玹
Nov 22 '18 at 11:56

@張睿玹 glad to help

– Ankit Agarwal
Nov 22 '18 at 11:57

add a comment |

Still nothing happened

– 張睿玹
Nov 22 '18 at 11:43

Still nothing happened upload.cc/i1/2018/11/22/03c6WG.png

– 張睿玹
Nov 22 '18 at 11:49

@張睿玹 just use ng-click="openurl(shopli.url)" without quotes. That should work for windows.open.

– Ankit Agarwal
Nov 22 '18 at 11:53

@ Shaheryar.Akram @Ankit Agarwal Thanks a lot ,it work.😊

– 張睿玹
Nov 22 '18 at 11:56

@張睿玹 glad to help

– Ankit Agarwal
Nov 22 '18 at 11:57

Still nothing happened

– 張睿玹
Nov 22 '18 at 11:43

Still nothing happened upload.cc/i1/2018/11/22/03c6WG.png

– 張睿玹
Nov 22 '18 at 11:49

@張睿玹 just use ng-click="openurl(shopli.url)" without quotes. That should work for windows.open.

– Ankit Agarwal
Nov 22 '18 at 11:53

@ Shaheryar.Akram @Ankit Agarwal Thanks a lot ,it work.😊

– 張睿玹
Nov 22 '18 at 11:56

@張睿玹 glad to help

– Ankit Agarwal
Nov 22 '18 at 11:57

add a comment |

This page is only for reference, If you need detailed information, please check here

Search This Blog

Ufyukyu