离子：拆分 <a> 标记 window.open url 以包含数据答案

【问题标题】：Ionic: Splitting an <a> tag window.open url to include data离子：拆分 <a> 标记 window.open url 以包含数据
【发布时间】：2017-09-12 12:39:05
【问题描述】：

我试图在我的标签中拆分一个 URL。

在 Ionic 中的一个 templates.html 文件中，我从外部链接到 Twitter 和 Facebook。

我正在使用 Cordova InAppBrowser，长话短说，Twitter 和 Facebook 的链接在正确的应用程序/系统浏览器中打开......但我无法找到一种方法来包含我可以使用的数据简单的版本。

使用时：

<a class="twitter" onClick="window.open('https://twitter.com/intent/tweet?text={{offer.title}}%20-%20{{offer.business.data.name}}%20-%20via%20@handle','_system','location=yes');return false;"><i>&#xE12f;</i> Twitter</a>

它正确打开，但没有继承 {{offer.title}} 和 {{offer.business.data.name}} 的正确数据 - 我需要一种方法来包含它。

使用时：

<a class="twitter" href="https://twitter.com/intent/tweet?text={{offer.title}}%20-%20{{offer.business.data.name}}%20-%20via%20@handle" target="_system"><i>&#xE12f;</i> Twitter</a>

它将正确的数据加载到 URL 中，但根本无法正确打开，这更是一个问题 - 必须有一种简单的方法：

'url.com/' + {{offer.title}} + '/something'

还是什么？

【问题讨论】：

您需要在控制器中使用ng-click 和一个函数。
啊，是的，我正在玩我的 controllers.js 文件，我添加了一个 $scope 来尝试解决这个问题，但我不知道如何使用 ng-click= 来引用它"openTwitter()" - 它一直说一个错误：openTwitter 没有被定义或类似的东西。
我使用了这段代码，现在绝对可以使用您提到的 ng-click 打开链接，但它错误地说 ReferenceError: offer is not defined $scope.openTwitter = function() { window.open('https://twitter.com/intent/tweet?text=' + offer.title + '%20-%20via%20@handle', "_system"); }跨度>
您需要传入您想要的offer，或者如果offer 是$scope 的属性，请使用$scope.offer。我不推荐第二种选择，因为它不太灵活。
谢谢，我已经通过使用您的建议和下面的答案以及示例代码来解决这个问题。

标签： javascript html url ionic-framework window.open

【解决方案1】：

有很多方法可以做到这一点，但在 Angular.js 中处理这个问题最有效的方法是使用 ng-click。类似于以下内容：

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';

  $scope.offer = {
    title: 'someTitle',
    business: {
      data: {
        name: 'some Business'
      }
    }
  };

  $scope.openTwitter = function(offer) {
    window.open('https://twitter.com/intent/tweet?text=' +
      offer.title +
      '%20-%20' +
      offer.business.data.name +
      '%20-%20via%20@handle', '_system', 'location=yes');
  }
});

HTML：

<a ng-click="openTwitter(offer)" href="">Open Twitter</a>

http://plnkr.co/edit/tqQWHc0nlp9Rpo85aSbV

【讨论】：

太棒了！谢谢！我设法在这里和那里进行了一些调整来使用您的代码，使其既能从 API/DB 继承正确的数据，又能在 Twitter 应用程序/系统浏览器中正确打开 - 谢谢！