ng-click에서 json 배열을 호출하는 방법은 무엇입니까?

Question

버튼 클릭시 json 배열을 호출하려고합니다. 버튼 클릭에 대한 세부 정보를 나열하고 싶습니다.

이

은

$scope.accc = function() { 
$scope.menuOptions(); 
} 

위의 JSON를 호출하는

$scope.menuOptions = [ 
     ['New Folder', function ($itemScope) { 
     }], 
     null, 
     ['Copy', function ($itemScope) { 

     }], 

     ['Paste', function ($itemScope) { 

     }], 
     ['Delete', function ($itemScope) { 



     }] 
    ]; 

나는 이런 식으로 뭔가를 원하는 형식입니다. 각도 js에 새로운입니다. 제발 도와주세요. 나는 이것이 유효한 질문인지 아닌지를 모릅니다.

Answer 1

이 시도 :

$scope.callItem = function(itemName, arguments) { 
    for (let itemID in $scope.menuOptions) { 
     var item = $scope.menuOptions[itemID]; 
     if (!!item) { 
     if (item[0] == itemName) { 
       item[1].apply(this, arguments); 
      break; 
     } 
     } 
    } 
} 

$scope.callItem('Copy'); 

를 각도에서 당신이 좋아하는 :

<ul> 
    <li ng-repeat="item in menuOptions" ng-click="item[1]()"> 
     item[0] 
    </li> 
</ul> 

또는 같은를 :

<ul> 
    <li ng-repeat="item in menuOptions" ng-click="callItem(item[0])"> 
     item[0] 
    </li> 
</ul> 

나는 기반 같아 데이터 구조를 사용하도록 권장합니다 배열 대신 객체에. 예를 들면 다음과 같습니다 :

$scope.menuOptions = { 
     'New Folder' : function() {}, 
     'Copy' : function() {} 
} 

Answer 2

JSON을 약간 조정해야 할 경우 배열 대신 개체 키로 '새 폴더'를 설정할 수 있습니다. 다음 예를 참조하십시오

/* Javascript: */ 
$scope.menuOptions = { 
    'New Folder': function ($itemScope) { 
     console.log('New Folder Created',$itemScope) 
    }, 
    'Copy': function ($itemScope) {}, 
    'Paste': function ($itemScope) {}, 
    'Delete': function ($itemScope) {} 
}; 

$scope.clickedMe = function(action_name,value){ 
    menuOptions[action_name](value); 
} 

을하고 버튼을 렌더링하는 NG-REPEAT를 사용하여이

/* HTML: */ 
<button ng-click="clickedMe('New Folder',myelement)">New Folder</button> 
<button ng-click="clickedMe('Copy',myelement)">Copy</button> 
<button ng-click="clickedMe('Paste',myelement)">Paste</button> 
<button ng-click="clickedMe('Delete',myelement)">Delete</button> 

처럼 HTML 템플릿 뭔가에서 사용 : 아래

<button ng-repeat="(key,value) in menuOptions" ng-click="clickedMe(key,other_elem_here)"> 
    {{key}} 
</button> 

Answer 3

메뉴 객체 배열을 :

$scope.menuOptions = [ 
      { 
       label:'New Folder', 
       action:function ($itemScope) { 
        alert('New Folder'); 
       }//End of function 
      }, 
      { 
       label:'Copy', 
       action:function ($itemScope) { 
        //function body 
        alert('Copy Copy'); 
       }//End of function 
      }, 
      { 
       label:'Paste', 
       action:function ($itemScope) { 
       //function body 
       alert('Paste'); 
       }//End of function 
      }, 
      { 
       label:'Delete', 
       action:function ($itemScope) { 
        //function body 
        alert('Delete'); 
       }//End of function 
      } 
     ]; 

UI :

<ul> 
    <li ng-repeat="item in menuOptions" ng-click="item.action()"> 
     {{item.label}} 
    </li> 
</ul> 

트리거 버튼 클릭에 NG 반복 중 어떤 기능 :

//that will triger 'New folder' function 
<button ng-click="menuOptions[0].action">{{menuOptions[0].label}}</button>