单击后动态更改按钮上的名称

时间:2016-12-23 11:30:16

标签: angularjs

我使用$ http.get api从数据库中检索内容,并使用ng-repeat显示每条记录。对于每个记录,我有一个like and comment button.点击按钮,我使用$ http.post插入记录,我必须change the name of button to "Liked"。问题是 - 点击任何一个记录按钮,所有其他记录,如按钮名称更改为喜欢,包括点击按钮。

 <div ng-repeat="dat in details | filter : { product_name : textname} as results">          
        <p style="color:#4C97C8;" class="lead"><strong>{{dat.summary}}</strong></p>
        <ul>
          <li><b>Product:</b><span> {{dat.product_name}}</span></li>
          <li><b>Product Manager:</b><span> {{dat.first_name}} {{dat.last_name}}</span></li>
          <li><b>Description:</b><span> {{dat.description}}</span></li>
        </ul>
        <button style="background-color:#4C97C8;color:white;height:30px" class="btn buttonlike" ng-click="likebtn(dat.id,loginname)"><span class="glyphicon glyphicon-hand-right"></span><strong> {{ likebtnname }}</strong></button>   
        <button style="background-color:#4C97C8;color:white;height:30px" class="btn" ng-disabled="comment" ng-click="comment=true"><span class="glyphicon glyphicon-comment"></span><strong> Comment</strong></button>
        <div class="input-group " ng-show="comment">
            <input type="text" id="commentarea" name="commentarea" class="form-control" placeholder="comment" aria-describedby="basic-addon2" ng-model="takecomment">
            <span class="input-group-addon" id="basic-addon2" ng-click="takecomment=mycomment(dat.id,takecomment)"><span class="glyphicon glyphicon-send"></span></span>
        </div>
</div>
脚本/控制器中的

likebtn()方法是

$scope.likebtnname="Like";
$scope.likebtn = function(idvalue,namevalue) {

  var likereque = {
    method: 'POST',
    url: "https://url/Likes",
    headers: {
         "Content-Type": "application/json"
    },
    data: {
      "platform": {
       "record": { "idea_record": idvalue,
                   "liker": $scope.loginname
                 }
                 }
          }
  }
  $http(likereque).then(function(){
       alert("Liked Successfully");
       $scope.likebtnname="Liked"; },
     function(){alert("try again");});
  }

如何更改单击按钮的名称?

4 个答案:

答案 0 :(得分:1)

<强> HTML:

<button style="background-color:#4C97C8;color:white;height:30px" class="btn buttonlike" ng-click="$parent.likebtn(dat.id,loginname, dat)"><span class="glyphicon glyphicon-hand-right"></span><strong> {{ dat.likebtnname||'Like' }}</strong></button> 

<强>使用Javascript:

$scope.likebtn = function(idvalue,namevalue,dat) {

  var likereque = {
    method: 'POST',
    url: "https://url/Likes",
    headers: {
         "Content-Type": "application/json"
    },
    data: {
      "platform": {
       "record": { "idea_record": idvalue,
                   "liker": $scope.loginname
                 }
                 }
          }
  }
  $http(likereque).then(function(){
       alert("Liked Successfully");
       dat.likebtnname="Liked"; },
     function(){alert("try again");});
  }

答案 1 :(得分:0)

现在你有一个变量$scope.likebtnname,所以当你改变它时,它会改变所有。 您可以使用track by $index进行ng-repeat,然后使用数组$scope.likebtnname[$index]并仅更改通过$index所需的数组。

答案 2 :(得分:0)

由于它们都具有相同的名称,因此常见,因此一个解决方案可以动态更改名称。 $ index的第一首曲目

div ng-repeat="dat in details track by $index| filter : { product_name : textname} as results">    

然后在您的按钮中添加ID

 <button style="background-color:#4C97C8; ng-model="$index"

然后在你的函数中传递那个id

 ng-click="likebtn(dat.id,loginname,$index)"

然后使用id update dom

$scope[id]="Liked";

答案 3 :(得分:0)

from pathlib import Path

path = "/Users/Desktop/test/"

p = Path(path)
for file in p.iterdir():
    if not file.is_file():
            continue
    print(file)
    print(file.read_text())