I have implemented a controller using typescript and angular js and getting data in response as well but there is some problem when i am trying to bind that data with my grid.I have used ng-repeater for it.
I have declared my controller on html page as :-
ng-controller="CustomerCtrl as custom"
And i am trying to access it in my controller as :-
ng-repeat="cust in custom.cust_File
and than
Full Name: {{cust.Name}}
I don't know where the problem exactly...
I solved this by using cust in custom.$scope.cust_File as described by #hugues Stefanski.
Thanx a lot....
Related
I hvae an angular view of a pdf preview that utilizes a controller to fill the view in. I am using pdflayer then to convert the html page into a pdf. The problem however is that no matter how I try and do this the scope variable values never make it into the pdf. I am basically trying to figure out a way to capture the angular view as an html string (data already injected) so that I can pass it to pdflayer. I have tried creating a directive and used replace within the directive then collecting the DOM as a string using .HTML().
For example:
I could like this
<div id="name">{{test.name}}</div>
to become this
<div id="name">Bob Smith</div>
It inevitably however turns into this when i use $('#name').html() and then console log it
<div id="name"></div>
or
<div id="name">{{test.name}}</div>
Any help would be appreciated even if the solution is to use a different method to create the pdf. Ultimately, I need to get a angular view into a formated pdf.
Please check if below library would work for you : https://www.npmjs.com/package/angular-save-html-to-pdf
So I'm making calls to an API and I'm receiving data in JSONP format. I'm trying to bind this data using angular data binding such as ng-bind or using double brackets and so forth.
however, for each object I receive I get an image code that is a full html tag like so:
[object]
description: "this is a description"
image_code:"<img src='https://s3.amazonaws.com/p.image.slated.com/film/67/25/59510/1_small.jpg?get=1398992737'>"
Does anyone have any idea as to how I would bind it so that for each object i would bind the src with the given image code?
I've tried it like this
<img ng-src={{object.image_code}}>
but its not working. Any help or thoughts would be appreciated. Thanks!
Try following
<img ng-src="{{object.image_code}}">
{{object.image_code}} should be wrapped inside " " but apparently missing in your code.
plnkr working example
As your object is having image as a string. You need to extract the url part of it in your controller.
data = {
description : "something",
image_code : "<img src='https://s3.amazonaws.com/p.image.slated.com/film/67/25/59510/1_small.jpg?get=1398992737'>"
};
Then in controller use regular expression to extract the url part.
$scope.image_url = data.image_code.match(/http.*(?=')/g).join();
now your $scope.image_url will have: "https://s3.amazonaws.com/p.image.slated.com/film/67/25/59510/1_small.jpg?get=1398992737" as the value.
Now you can use it as:
<img ng-src="{{image_code}}">
I used SyntaxHighlighter API to highlight the given xml snippet.The xml string generate from server side and angular controller set value into the html page.
Sample HTML snippet
<div class="modal-body">
<pre id="xmlText" class="brush:xml">{{xml}}</pre>
</div>
AngularJs controller snippet
//code goes here
$scope.xml=data.xml;
data fetching successfully.but the problem was that when set xml content into <pre> via {{xml}} nothing display.Please let me know how to solve this.
Note:I have included necessary SyntaxHighlighter files.when i manually copy some xml string into pre its works fine.but via Angular model its empty.
I get JSON like this
{
"lots of":"keys"
"description" : {
"key":"Some sample key",
"value":"This is the markup™"
}
}
from server and I ultimately iterate the description objects and populate table rows with two columns: one for the key and one for the value.
I have tried putting on my <td> tag ng-bind-html as well as injecting $sce into my controller and using trustAsHtml but so far the string always displays as it is in the JSON. Not every value will be HTML but I can easily detect based on the key if HTML is a possibility. It seemed when I put in the directive on the td it did not display anything if no HTML was present. I am interested in using something that can allow HTML in the value but not require it so I can display either
HTML fragment
<tr ng-repeat="(key, val) in record.description">
<td>{{key}}:</td>
<td>{{val}}</td>
</tr>
I created a quick fiddle here:
https://jsfiddle.net/frishi/mvw97s3q/6/
I used angular-sanitize, which I am not sure you mentioned injecting in your module dependency list. Either way, the example works simply by using ng-bind-html
Relevant docs page: https://docs.angularjs.org/api/ng/directive/ngBindHtml
It works by using the directive ng-bind-html on the element you want to display the HTML string in. You use it like so:
<p ng-bind-html="data.firstName"></p>
assuming that data.firstName = "<strong>FeeFee</strong>" or something like that.
I would also like to add that Angular does not allow this natively because of legitimate security concerns. That and the fact that allowing arbitrary HTML to be rendered might not always produce desirable results. Your page layout could quite possibly break because of some HTML you allowed to be passed through.
Angular was designed with security in mind, and will prevent you from displaying HTML from raw strings whenever possible - to prevent various injection attacks.
Here is workarround for your problem: AngularJS: Insert HTML from a string. Generally you should use ng-bind-html insted of ng-bind (this is used by curly braces).
Anyone managed to integrated supersize with angular js?
I tried creating a directive and placing the following code inside a directive
$.supersized({
//params :
supersize did work in creating the
<ul id=supersized" .... >
However my screen isn't displaying supersize's full screen slideshow. Any idea why?