I have variables in my angular controller and I'd like to take the data in the variable and put in a script tag in my html but I have no clue how to execute this. I'm doing this because I want to take a picture and put it into my LinkedIn post with the share button. Based on the docs here, it seems pretty straight forward if I can just get the data from my controller into their script tags.
For example:
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>
////////////////////////// Thanks for the copious comments. Here is what I'm trying in more detail with 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>
I still think something is going wrong. But what? Am I using the http correctly as I've only done it using Angular thus far.
See the snippet just below how to access Angular Scope outside angular :)
EDIT (Afer reading your updated question)
You'll better transcode all your LinkedIn
scripts to angular way as kicken suggest you :) :
If you still want to do that way :) ==>
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>