Javascript 如何将变量从角度控制器传递到html<；脚本></脚本>；？

我的angular控制器中有变量，我想将变量中的数据放入html中的脚本标记中，但我不知道如何执行它。我这么做是因为我想拍张照片，然后用共享按钮把它放到我的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>

var有效载荷={
“注释”：$scope.test“内容”：{
“标题”：$scope.hope，
“someArray”：$scope.array，
“提交的url”：window.location.href
}
};

////////////////////////// 谢谢你的大量评论。以下是我在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>

$.get（”https://public-api.wordpress.com/rest/v1.1/sites“，功能（响应）{
var post=u.first（u.filter（response.posts，函数（n）{return n.title.replace（//g，“-”）.replace（//[：]/g，“”）.toLowerCase（）===$stateParams.id}））；
var post1=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\；
**var image=post1.pic**
**var title=post1.title**
**var webAddress=window.location.href**
函数onLinkedInLoad（）{
IN.Event.on（在“auth”中，共享内容）；
}
函数onSuccess（数据）{
控制台日志（数据）；
}
函数onError（错误）{
console.log（错误）；
}
功能共享内容（标题、图像、网址）{
var有效负载={
“内容”：{
“头衔”：头衔，
“已提交图像url”：图像，
“提交的url”：网址
}
};
IN.API.Raw（“/people/~/shares？format=json”）
.方法（“员额”）
.body（JSON.stringify（有效负载））
.结果（成功时）
.错误（onError）；
}
});

---

我还是觉得有点不对劲。但是什么呢？我是否正确地使用了http，因为到目前为止我只使用了Angular。

请参阅下面的片段，了解如何访问Angular之外的Angular作用域：）

编辑（在阅读更新的问题后）

您最好按照kicken的建议，将所有

LinkedIn

脚本转换为angular方式：）：

更少的spagetti代码

少维护

有更多的时间在YT上观看lol猫 如果您仍然想这样做：）==>

var-app=angular.module（'app'，[]）；
应用程序控制器（'MainCtrl'，函数（$scope）{
$scope.test='toto'；
$scope.hope=‘我的头衔’；
$scope.array=['A'，'B'，'C']；
$scope.payload={}；
});

var myFunction=function（）{
var e=document.getElementById（'app'）；
var$scope=angular.element（e.scope（）；
log（$scope.payload）；
$scope.payload={
“注释”：$scope.test，
“内容”：{
“标题”：$scope.hope，
“someArray”：$scope.array，
“提交的url”：window.location.href
}
};
$scope.$apply（）；
};
你好{{payload}}

点击我

您需要做的是将LinkedIn代码移动到Angular中，而不是尝试将数据从Angular传递到通用的

标记中

快速浏览一下就可以看出，这是生成链接请求的关键代码：

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

然后你可以做的就是把代码放在你需要的角度代码中。您提到有效负载的数据来自一个$http请求，因此您可能希望将其输入到$http成功处理程序中

$http({url:'/whatever'}).then(function(response){
    var payload = { /* Generate payload */ };

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

    function onSuccess(){ /* LinkedIn success */ }
    function onError(){ /* LinkedIn error */ }
});

---

正如其他人所建议的，如果可能的话，将所有javascript代码移动到控制器中是最好的解决方案。为此，您的控制器将如下所示：

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


  $scope.sendData = function () {
    var data = $.param({
      "comment": $scope.test,
      "content": {
      "title": $scope.hope,
      "someArray": $scope.array,
      "submitted-url": window.location.href
    });

    var config = {
      headers : {
        'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'
      }
    }

    $http.post('https://api.linkedin.com/v1/people/~/shares?format=json', data, config)
      .success(function (data, status, headers, config) {
        //it worked
      })
      .error(function (data, status, header, config) {
        //there was an error
    });
  };    
}

---

然后，在html中，将ng submit=“sendData（）”放在用于共享的表单上。如果共享内容不在表单中，您可以只执行ng click=“sendData（）”

您不能这样做。在初始化控制器之前，脚本标记会得到很好的评估。这个用例是什么？为什么不能在angular上下文中执行任何需要执行的操作？@charlietfi按照正常的angular实践，我在html的作用域中拥有所有元素。我还需要用这些数据填充LInkedIn负载参数。我不知道如何将数据从angular（我知道如何原始来源）获取到脚本标记。实际数据来自哪里？如何实现呢？@rashadb然后将LinkedIn负载包装成某种角度的组件，并允许它驱动数据管理。这不是正确的处理方法，所以只要初始化$http回调中需要的linkedIn代码就可以了，我看到了，但从我看到的情况来看，我仍然不知道插件是如何工作的；它没有发送数据。