动态生成的html按钮,按下单击按钮不点击

时间:2017-01-10 11:34:04

标签: javascript html angularjs

我有以下代码,根据其余调用,生成一个按钮列表。单击按钮时,我需要在页面右侧显示一个屏幕。屏幕因所点击的按钮而异。

以下是动态填充Button的代码

var app = angular.module("HConfigureModule",[]);
app.controller('HConfigureController',['$scope','$http',function($scope,$http){
$scope.myvalue = false;
$scope.configurePList= function(){
    $scope.result = "" ;
    $scope.searchValue = "";
    $scope.namelist=[];
    $scope.myvalue = true; 
    var protocol = window.location.protocol;
    var hostDetails = window.location.host;
    var instanceDetails = window.location.pathname;
    var url = protocol + "//" + hostDetails
    + instanceDetails + "index";
    //alert(url+'/getPluginsList.html');
    var response = $http.get(url+'/getPlugList.html');
    response.success(function(qResult){
        var tst = qResult ;
        var len = tst.length;
        $scope.numStorages = len ;

        var i;
        var myEl = angular.element( document.querySelector('#connListDiv') );
        for(i=0;i<len;i++)
            {

        $scope.result = myEl.append('<button type="button" style="word-wrap:break-word" ng-click="display1();" class="btn btn-default pluginClass dummy">'+qResult[i].name+'</button>');
                $scope.namelist.push(qResult[i].name) ;
            }

    });
    var testbutton = angular.element(document.querySelector('.dummy'));
    testbutton.bind('click', $scope.display1());
   };

以下是display1()

的代码
    $scope.display1 = function(){
    var  expluclass = angular.element( document.querySelector('.existingPluginClass')) ;
        expluclass.show() ;
        var nplugclass = angular.element( document.querySelector('.newPluginClass')) ;
        nplugclass.hide();
        angular.element( document.querySelector('.connDivClass')).hide();
        var link = angular.element( document.querySelector('.pluginClass'));
        link.removeClass("btn-primary");
       var plugName = link.text().trim();
        alert(plugName);
        if(plugName == "HFS")
            angular.element( document.querySelector('#connPropsDivHFS')).show();
        else{
            angular.element( document.querySelector('#connPropsDivOthers')).show();
            var protocol = window.location.protocol;
            var hostDetails = window.location.host;
            var instanceDetails = window.location.pathname;
            var url = protocol + "//" + hostDetails
            + instanceDetails + "index";
            //alert(url+'/getPluginsList.html');
            var response = $http.get(url+'/getSelectedPDetails.html?pluginName='+plugName);
            response.success(function(queryResult){


            });
        }
    }

我面临的问题是,基于getPlugList.html响应,动态生成了大约10个按钮。但是按钮单击在第一次只能工作一次。由于按钮是动态生成的,我不得不使用将click事件绑定到按钮。

需要帮助    如果有一个选项可以让ng-click工作,即使在初始加载后也可以告诉我。我希望每次单击10个按钮中的一个时调用display1()。

非常感谢任何帮助。在此先感谢

0 个答案:

没有答案