Angularjs href в контроллере

Раньше у меня было 2 ссылки, по которым пользователь может щелкнуть и связать их с другой страницей, но теперь я хотел бы иметь список опций, где пользователь также может выбирать и связывать их. Как я могу этого добиться? Я делал это раньше этим методом

<a ng-href = "LINK" ng-click = "getKML(selectedTheme)" target = "_blank" download>KML</a>
<a ng-href = "LINK" ng-click = "getSHP(selectedTheme)" target = "_blank" download>KML</a>

Но теперь я хотел бы иметь список опций, чтобы сделать то же самое, как я могу этого добиться?

angular.module('MyApp', ['ngMaterial', 'ngMessages', 'material.svgAssetsCache'])
    .controller('AppCtrl', function($scope, $mdDialog) {
        $scope.downloadFormat = ["a", "b"];
    });

<!DOCTYPE html>
<html lang = "en">

  <head>
      <meta charset = "UTF-8">
      <title>angular Js Modal popup</title>
      <link rel = "stylesheet" href = "https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
      <link rel='stylesheet' href='https://cdn.gitcdn.link/cdn/angular/bower-material/v1.1.1/angular-material.css'>
      <link rel='stylesheet' href='https://material.angularjs.org/1.1.1/docs.css'>
      <link rel = "stylesheet" href = "css/style.css">
  </head>

  <body ng-controller = "AppCtrl" ng-app = "MyApp">
      <select ng-model = "selectedFormat" ng-options = "x for x in downloadFormat">
      </select>
      <button ng-click = "lalalu(selectedFormat)">Download</button>
      <!--
                      Copyright 2016 Google Inc. All Rights Reserved.
                      Use of this source code is governed by an MIT-style license that can be foundin the LICENSE file at https://material.angularjs.org/HEAD/license.
  -->
      <script src='https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js'></script>
      <script src='https://cdn.gitcdn.link/cdn/angular/bower-material/v1.1.1/angular-material.js'></script>
      <script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js'></script>
      <script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-route.min.js'></script>
      <script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js'></script>
      <script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-messages.min.js'></script>
      <script src='https://s3-us-west-2.amazonaws.com/s.cdpn.io/t-114/svg-assets-cache.js'></script>
      <script src = "js/index.js"></script>
  </body>

</html>

Stackblitz или какой-нибудь пример кода?

— 16.11.2018 07:05

@PrashantPimpale я добавил фрагмент

— 16.11.2018 07:19

javascript angularjs

16.11.2018 07:03

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

1 599

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Для этого вы можете использовать службу $ location, вы можете перенаправить своего пользователя на другой веб-сайт с помощью этой службы. Обратитесь к плункеру ниже, выберите ссылку из раскрывающегося списка, и она перенаправит вас на этот веб-сайт:

var app = angular.module('main',[]);
app.controller('myctrl', function($scope, $location, $window){
  $scope.downloadFormat = ["https://code.angularjs.org/1.2.18/docs/"];
  $scope.redirectToSite =  function(site){
    if ($scope.$$phase) { // check is digest cycle is already running
        $window.location.href = site;
    } else {
        $location.url(site);
        $scope.$apply();
    }
   };
});

<script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular.min.js"></script>
<div ng-app = "main">
  <div ng-controller = "myctrl">
    <select ng-model = "selectedFormat" ng-options = "x for x in downloadFormat">
    </select>
    <button ng-click = "redirectToSite(selectedFormat)">Redirect</button>
  </div>
 </div>

16.11.2018 07:21

Другие вопросы по теме

Как создать круговую полосу, используя значения радиальной оси в диаграмме точечной полярности, используя Plotly

Как редактировать объект из массива в AngularJS

Как получить доступ к значению массива из-за пределов области видимости с помощью Angular JS

Флажок Angularjs не работает при первом нажатии

HttpResponseMessage.Content находится в массиве

Добавить новые параметры списка в поле списка динамически - AngularJS

Добавленный элемент html внутри угловой директивы удаляется из DOM при изменении представления

Как отправить несколько значений и файлов, соответствующих друг другу

Маркированный список букв после буквы 'z'

Получение предыдущего URL-адреса не текущего URL-адреса в angular js

Angularjs href в контроллере

Ответы 1

Другие вопросы по теме

Похожие вопросы