如何将变量从Angular控制器传递到html <script> </ script>?

rashadb

我的角度控制器中有变量,我想将变量中的数据放入html的script标签中,但是我不知道如何执行此操作。我这样做是因为我想拍张照片,然后使用“分享”按钮将其放到我的LinkedIn帖子中。根据此处的文档,如果我可以将控制器中的数据放入其脚本标签中,这似乎很简单。

例如:

controller.js

.controller('PostCtrl', function ($scope, $http, $stateParams) {
     $scope.test = "something";
     $scope.hope = 5
     $scope.array = [things];
}

html

<script>
var payload = {
  "comment": $scope.test "content": {
    "title": $scope.hope,
    "someArray": $scope.array,
    "submitted-url": window.location.href
  }
};
</script>

//////////////////////// 这是我正在使用LinkedIn进行更详细尝试的内容:

<script type="IN/Share" data-url={{webAddress}} data-counter="right">
                  $.get( "https://public-api.wordpress.com/rest/v1.1/sites", function( response ) {
                    var post = _.first(_.filter(response.posts, function(n){return n.title.replace(/ /g,"-").replace(/[:]/g, "").toLowerCase() === $stateParams.id}));
                    var post1 = _.assign(post, {category: _.first(_.keys(post.categories)), pic: _.first(_.values(post.attachments)).URL, credit: _.first(_.values(post.attachments)).caption, linkCredit: _.first(_.values(post.attachments)).alt, fullStory: post.content.replace(/<(?!\s*\/?\s*p\b)[^>]*>/gi,'')});
                    **var image = post1.pic;**
                    **var title = post1.title;**
                    **var webAddress = window.location.href;**

                    function onLinkedInLoad() {
                      IN.Event.on(IN, "auth", shareContent);
                    }

                   function onSuccess(data) {
                    console.log(data);
                   }

                   function onError(error) {
                    console.log(error);
                   }

                   function shareContent(title, image, webAddress) {

                    var payload = {                         
                      "content": {
                        "title": title,
                        "submitted-image-url": image,
                        "submitted-url": webAddress
                      }
                    };

                    IN.API.Raw("/people/~/shares?format=json")
                      .method("POST")
                      .body(JSON.stringify(payload))
                      .result(onSuccess)
                      .error(onError);
                   }
                  });

                  </script>

我仍然认为出了点问题。但是呢 我是否正确使用了http,因为到目前为止我只使用Angular完成了它。

罗杰里奥·苏亚雷斯

请参阅下面的代码片段,如何访问angular之外的Angular Scope :)

编辑(阅读您更新的问题)

您最好将所有LinkedIn脚本转码为有角度的方式,如建议:):

  1. 更少的spagetti代码
  2. 减少维护
  3. 在YouTube上有更多时间看哈哈猫

如果您仍然想这样做:) ==>

var app = angular.module('app', []);
app.controller('MainCtrl', function($scope) {
  $scope.test = 'toto';
  $scope.hope = 'My Title';
  $scope.array = ['A', 'B', 'C'];
  $scope.payload = {};
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script>
    var myFunction = function() {

      var e = document.getElementById('app');     
      var $scope = angular.element(e).scope();
      console.log($scope.payload);
      $scope.payload = {
        "comment": $scope.test,
        "content": {
          "title": $scope.hope,
          "someArray": $scope.array,
          "submitted-url": window.location.href
         }
      };
      $scope.$apply();
    };
</script>
<body ng-app="app" ng-controller="MainCtrl" id="app">
  <p>Hello {{payload}}!</p>
  <button onclick="javascript:myFunction()">Click me</button>  
</body>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

将变量从<script>传递到HTML代码?

<script /> vs <script> </ script>与webpack和angular

如何将变量传递给Pug的`script.`块?

从<script> </ script>在<%%>中定义的访问变量

如何将<script> </ script>附加到<div>并执行它?

将结果从 <script> 导入 <script setup>

Javascript - 将 <script></script> 附加到 Div

如何在javascript中附加<script> </ script>?

直接从<script> HTML标记将变量传递给Javascript

将变量从 Code.gs 传递到 Google App Script 中的 html

Splinter:如何将参数传递给execute_script?

如何将参数传递给Mongo Script

如何将MySQL表列作为<script>中的变量?

如何从按钮运行 <script>

如何在JavaScript变量中包含转义的<script> </ script>标记?

AngularJS:将<script type =“ application / json”>中的json数据获取到控制器中

<script>标记中的Django变量

在echo <script>内容中传递PHP变量

在 HTML 中 <script src=""></script> 标记的 src 路径中升级

HTML <script defer>是否可以在<script async>之前执行?

scrapy / regex从html <script> </ script>获取json_object

<Script>标记内的HTML代码

如何在<script>标签中获取Spring MVC控制器模型键值

如何从<script>执行webpack模块?

<script defer =“ defer”>是如何工作的?

如何获得<script>的下载进度?

将<script>标记或未消毒的值传递到车把布局?

如何使用Google Apps脚本中的google.script.run将JS对象传递到服务器函数?

将“ </ script>”放在JavaScript中的变量中