I still want {{1+2}} to be evaluated as normal. But in addition to the normal interpolator, I want to create a custom one that I can program to do whatever I want.
e.g. <p>[[welcome_message]]</p> should be a shortcut for <p>{{'welcome_message' | translate}}</p>, or <p translate="welcome_message"></p>. That way, i18n apps would be much more convenient to write.
Is anything like that possible? I'm currently going through the angular.js source code, but the interpolation system looks pretty complicated(?). Any suggestions?
I created a directive that regex-find-replaces it's innerHTML. Basically, I can rewrite any text into any other text. Here's how I did it:
How do I make angular.js reevaluate / recompile inner html?
Now all I have to do is to place my directive-attribute, "autotranslate", in one of the parent elements of where I want my interpolator to work, and it rewrites it however I want it! :D
<div class="panel panel-default" autotranslate>
<div class="panel-heading">[[WELCOME]]</div>
<div class="panel-body">
[[HELLO_WORLD]
</div>
</div>
becomes
<div class="panel panel-default" autotranslate>
<div class="panel-heading"><span translate="WELCOME"></span></div>
<div class="panel-body">
<span translate="HELLO_WORLD"></span>
</div>
</div>
which does exactly what I wanted.
I don't think that's possible, but if you really want to save some characters you could create a function on your rootScope called t, then call it within your views:
<p>{{ t(welcome_message) }}</p>
Related
I cannot see the issue in my html, but i can get the show/hide to work properly for a portion but not for another portion. It is the same ng-model. I am checking to see if feedback exists, if it does show one area, hide another. It is only working for the checklist. The checklist show and hides properly, but the message needs to display if the checklist is hidden. I know this is really simple, but no idea why it won't showing/hiding but i think it boils down to using feedback.length more then once. Can I do that? I have tried ng-if="feedback.length>0" and also ng-show="feedback.length>0" inside of the div for myMessage. The checklist is the only one that hides.
<div class="col-md-3" id="myMessage" ng-if="feedback.length>0">
<div class="alert alert-success">You have already submitted feedback for this user.</div>
</div>
<div class="col-md-3" id="checkList" ng-if="feedback.length==0">
<div class="row">
<div class="panel panel-default questionHolder2">
<div class="panel-heading"><strong>Thesis</strong></div>
<div class="panel-body">
1. After reading, but looking back at the paper now, can you summarize or paraphrase the author's argument or main point that s/he is trying to convey to the reader?
</div>
</div>
</div>
</div>
I am new to webdriver and I am automating a site. In which I have to find a text on that page and I want to click on its parent div. Can anyone please help?
Below is the HTML code.
<div class="col-md-6 col-sm-6 col-lg-6">
<p>
<strong class="detailShow ng-binding" ng-click="showJobs('NonInvite',item.taskId)"> TEST CR1 START DATE </strong>
</p>
</div>
The easiest way to achieve this is directly using xpath.
You can choose the 'more ugly' way like this:
.//strong[contains(#class,'detailShow')]/../..
Explanation:
/.. - this is how you get the parent element. Having just one, means that you'll get the <p> tag, so to get the <div> you need another one.
Or, you can go in a better manner like this:
.//strong[contains(#class,'detailShow')]/ancestor::div[#class='col-md-6 col-sm-6 col-lg-6']
Explanation:
ancestor::div - this one goes up until and returns all parent that are <div> tags. Since you need only the first <div> parent, you need to specify which one, therefore: ancestor::div[#class='col-md-6 col-sm-6 col-lg-6']
Now, if the bootstrap class is your only identifier, and there is a chance you may be inside a <table> you can also go with ancestor::div[1]
I am new to Angular.js and want to use one ng-controller within another ng-app and ng-controller like this so that I will be able to use the code before I used on the other pages as well.
Please help me out and correct me if I am wrong anywhere.
<div id="divFriendList" class="container" ng-app="friendModule" ng-controller="friendController">
<div id="module2" ng-app="cardsModule" ng-controller="CardsController">
<div ng-repeat="card in cards></div>
</div>
</div>
I am rather new as well, but I believe a way to do this would be to declare a dependency in your module. For example, angular.module('friendModule', ['cardsModule']);. Such an example can be found here. For more about modules and a tutorial on angular you can visit W3Schools.
As for your code, you're missing the closing quotation in <div ng-repeat="card in cards>. Further, you are asking ng-repeat to iterate each card in cards, but you have not defined what cards is. Therefore, you'll want to change
<div id="module2" ng-app="cardsModule" ng-controller="CardsController">
to
<div id="module2" ng-app="cardsModule" ng-controller="CardsController as cards">.
Additionally, you will not get any information displayed if you don't ask for an output such as {{card}}. I would also consider declaring your ng-apps before hand and not when they're needed - but I'm unsure as to the efficiency of this.
What I would update as:
<div id="divFriendList" class="container" ng-app="friendModule" ng-controller="friendController">
<div id="module2" ng-app="cardsModule" ng-controller="CardsController as cards">
<div ng-repeat="card in cards">{{ card }}</div>
</div>
</div>
Hope that helps.
I may have worded this title incorrectly but I am hoping to still get some help. I am trying to use an expression that I get from an ng-repeat to include an new page using ng-include but it is not rendering. I can write in the page I want, but I want to use the expression to include multiple pages dynamically
<div ng-app="" id="container" ng-controller="pagesController">
<span ng-repeat="x in pages">
{{x.Page | uppercase}}
<b ng-if="!$last" href="#"> - </b>
<div ng-include="'{{x.HTML}}'" name="{{x.Page}}"></div>
</span>
But if I manually enter the pages like so:
<div ng-include="'generic.htm'" name="generic"></div>
It works as expected.
I am getting used to Angular.js obviously and I am not sure if this is possible or if I can do what I want really. Any help would be appreciated.
ng-include is an angular directive, and assuming x.HTML is a string, omit the {{}} and the single quotes:
ng-include="x.HTML"
Is there a web scraping tool or library that auto-detects repeating HTML blocks and scrapes the text content inside the blocks, thus removing the need for human to manually input the rules - CSS selectors or xpath to find the content?
This is based on the assumptiom that modern content website is generated dynamically by server-side languages such as PHP or Python. The content is almost always rendered by a for loop in the template, hence the repeating HTML blocks can always be found. An example:
<div id="content">
<div class="blog entry">
<div class="title">
<h1>1st post</h2>
</div>
<div class="content">
<p>...</p>
</div>
</div>
<div class="blog entry">
<div class="title">
<h1>2nd post</h2>
</div>
<div class="content">
<p>...</p>
</div>
</div>
<div class="blog entry">
<div class="title">
<h1>3rd post</h2>
</div>
<div class="content">
<p>...</p>
</div>
</div>
</div>
Libraries like bautiful soap and scrapy rely on human to input the rules before the scraping can be carried out. They are not what I want.
Haven't used it, but heard about scrapely:
Unlike most scraping libraries, Scrapely doesn't work with DOM trees
or xpaths so it doesn't depend on libraries such as lxml or libxml2.
Instead, it uses an internal pure-python parser, which can accept
poorly formed HTML. The HTML is converted into an array of token ids,
which is used for matching the items to be extracted.
Scrapely extraction is based upon the Instance Based Learning
algorithm and the matched items are combined into complex objects
(it supports nested and repeated objects), using a tree of parsers,
inspired by A Hierarchical Approach to Wrapper Induction
You might want to look at my scraping library. It doesn't work automatically nor does it detect repeated parts. But it comes close, since it doesn't need rules at all and instead uses templates, which you can get directly from the html you have.
E.g. with your example above, the template to read all the posts in 2 arrays is:
<div id="content">
<div class="blog entry">
<div class="title">
<h1>{title:=.}</h1>
</div>
<div class="content">
<p>{content:=.}</p>
</div>
</div>*
</div>
You may try HTQL:
import htql;
a=htql.Browser();
p,b=a.goUrl('http://channel9.msdn.com/Blogs/Vector/Announcing-BUILD-2012');
htql.query(p, '&html_main_text');
p,b=a.goUrl('http://stackoverflow.com/questions/tagged/screen-scraping');
htql.query(p, '&html_main_text');