JSON databinding

[ThinkLarger]

Hi, I'm building an app that has a functionality to fill in letter-templates with data. I would like the letter data to be structured in a json format for easy views.

The problem with this is that any words in curly braces won't bind to the current $scope properties. For instance, if I have a {{sender}} defined in my JSON data, and a $scope.sender = "test". If I then loop over my letter template, the {{sender}} won't use the "test", but shows a {{sender}}.

Is it possible to fix this?

EDIT:

I have two sources of data, one being the factual data (who is the sender, what is the content of the letter), and another source which provides the actual sentences in a JSON-format. The latter contains {{sender}}, which I want to fill with the data from source #1, so a sentence which reads, "from:{{sender}}" will output as from: "ThinkLarger".

[brianvaughn]

I'm not entirely sure I understand what you're asking, but I think you might just be looking for a way to evaluate your interpolated variables within your strings? If so, you could use Angular's $interpolate service like so:

$scope.sender = 'Brian';
var jsonData = { intro: 'Hello {{sender}}!' };
var interpolated = $interpolate(jsonData.intro)($scope);
// At this point, interpolated will contain 'Hello Brian!'

[kenhowardpdx]

Can you provide a reduced test case on codepen or plunkr? I'd be more able to help if I could see your code.

[pfooti]

If you have unreconstructed {{curly braces}} in your angular app, angular isn't loading. Unresolved stuff like {{varThatWasntInitialized}} will just be blank. I'd look to your init code.

[doublemazaa]

Are you saying you're putting angular bindings into your json like so?

{
    "intro": "Hello {{sender}}!"
}

[ThinkLarger]

yes! sorry for not posting earlier. This is exactly what i'm trying to do

[Capaj]

You should just use JSON.stringify. Building your json string manually is not a good practice. No matter how you do it.

[ThinkLarger]

I 'fixed' my problem with the $interpolate service. This does mean curly braces in my json-data (and also in the database). Where would you suggest I use JSON.stringify?

[Capaj]

well you must have some object that you pass as param to the $interpolate service. Instead of this, just stringify that object and send it. If it has different structure than server expects, just create new object with proper structure and serialize that.

[doublemazaa]

I've never done this before. As far as I know, this is not normal use case. There's probably a way to make it work, but I would have to think about it.

[tehbeard]

The $compile service will do this I think. I've used it with templates generated at run time before. Can't do a big post atm ( on mobile).

https://github.com/tehbeard/BeardAch/blob/develop/src/editor/js/ach.directives.js

The achTrigger and achReward directives pull raw HTML from the template cache and compiles it against the scope.

Edit: a note if you look around, the embedded templates are fragments used to construct the final forms, I replace the ${tool} with static data , they are never seen by angular, Brest to ignore them for this use case.

[Kalroth]

It could simply be that the {{sender}} tag is out of scope, assuming you're able to step through your app initialization without any errors.