Как создать несколько кнопок для нажатия на страницу с помощью массива в angularjs? - PullRequest
Новая
       27

Как создать несколько кнопок для нажатия на страницу с помощью массива в angularjs?

0 голосов
/ 26 сентября 2019

Я пытался создать несколько кнопок, используя массив в Angularjs.Мой вопрос заключается в том, как поместить значение, например, функцию или код, например,

myNavigator.pushPage ('page')

внутри ng-click из массива и сделать кнопкуработа для навигации

Это код 

<html>
<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
  <script src="https://unpkg.com/angularjs-onsenui/js/angularjs-onsenui.min.js"></script>
  <link rel="stylesheet" href="onsenui.css"/>
  <link rel="stylesheet" href="onsen-css-components.css"/>
  <script src="angular.min.js"></script>
  <script src="onsenui.min.js"></script>
  <script src="angularjs-onsenui.min.js"></script>
</head>
<body>
  <template id="home">
    <ons-page>
      <ons-toolbar>
        <div class="left">
          <ons-back-button></ons-back-button>
        </div>
        <div class="center">Home</div>
      </ons-toolbar>

      <ons-list ng-repeat="x in data">
        <ons-list-item ng-click="x.link">
        {{x.btn}}
        </ons-list-item>
      </ons-list>

    </ons-page>
  </template>

  <template id="pg1">
    <ons-page>
      <ons-toolbar>
        <div class="left">
          <ons-back-button></ons-back-button>
        </div>
        <div class="center">
          Page1
        </div>
      </ons-toolbar>
    </ons-page>
  </template>

  <template id="pg2">
    <ons-page>
      <ons-toolbar>
        <div class="left">
          <ons-back-button></ons-back-button>
        </div>
        <div class="center">
          Page2
        </div>
      </ons-toolbar>
    </ons-page>
  </template>

  <template id="pg3">
    <ons-page>
      <ons-toolbar>
        <div class="left">
          <ons-back-button></ons-back-button>
        </div>
        <div class="center">
          Page3
        </div>
      </ons-toolbar>
    </ons-page>
  </template>
  <script>
    var module = angular.module('app', ['onsen']);
    module.controller('Ctrl', ['$scope',  function ($scope){
      $scope.pg1 = function(){
        myNav.pushPage('pg1');
      };
      $scope.pg2 = function(){
        myNav.pushPage('pg2');
      };
      $scope.pg3 = function(){
        myNav.pushPage('pg3');
      };
      $scope.tombol = [
      {link:'pg1()', data:'Tombol 1'},
      {link:'pg2()', data: 'Tombol 2'},
      {link:'pg3()', data: 'Tombol 3'}
      ]
    }]);
  </script>
</body>
</html>

Я попробовал несколько кодов, и это не работает, и я искал решение в Интернете, и я не могу его найти

...