简体   繁体   English

在脚本标签中访问Angular变量

[英]Access Angular variable within script tag

I am making a web app:front-end in Angular and backend in Rails. 我正在制作一个Web应用程序:Angular中的前端和Rails中的后端。 I am using LinkedIn's member profile plugin which shows person's profile based on URL being passed. 我正在使用LinkedIn的成员个人资料插件,该插件基于所传递的URL显示人员的个人资料。 Here is the code for this plugin. 这是此插件的代码。

<script src="//platform.linkedin.com/in.js" type="text/javascript"></script>
<script type="IN/MemberProfile" data-id="(Your LinkedIn URL)" data-format="inline" data-related="false"></script>

I want to make data-id part dynamic. 我想使data-id部分动态化。 Basically, I will let my users to write their linkedin address in text box and save it to Angular's variable. 基本上,我将让我的用户在文本框中写入他们的linkedin地址,并将其保存到Angular的变量中。 When the value changes, I want that value gets assigned to data-id . 当值更改时,我希望将该值分配给data-id But I'm not sure whether data-id can access a variable in Angular. 但是我不确定data-id是否可以访问Angular中的变量。

Quite simple. 非常简单。 Create your app along with a global controller that will be initialised on your html tag like so: 创建一个应用程序以及将在html标记上初始化的全局控制器,如下所示:

<html ng-app="app" ng-controller="myctrl">
  <head>
     <script type="IN/MemberProfile" data-id="{{myId}}" data-format="inline" data-related="false"></script>
  </head>
</html>

And have this as your controller and app initialisation, or something similar: 并将其作为您的控制器和应用程序初始化,或类似的操作:

var app = angular.module('app', []);
app.controller('myctrl', ['$scope', function($scope){
  $scope.myId = 123;
}]);

To break it down, $scope.myId will be assigned the LinkedIn ID, and it is output on the page inside the head tag (I'm guessing that's where you want it) within the data-id attribute on the script tag. 要对其进行分解,将为$scope.myId分配LinkedIn标识,并在script标签的data-id属性内的head标签(我想是您想要的位置)内的页面上输出它。

WORKING EXAMPLE 工作实例

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM