Skip to content
Snippets Groups Projects
Commit 19230d6a authored by totten's avatar totten
Browse files

AngularJS Change Sets - Update title. Add intro para.

parent 46b91868
No related branches found
No related tags found
No related merge requests found
# AngularJS: Alteration
# AngularJS: Change Sets
The [Quick Start](quickstart.md) and [Loader](loader.md) provide examples of
creating *new* screens. But what if you need to alter an *existing* screen?
CiviCRM allows third-parties to define *change sets* which programmatically
manipulate Angular content (before sending it to the client).
## Background
Most AngularJS tutorials focus on idealized projects where a single
developer or product-owner exercises full authority over their application.
But CiviCRM is an _ecosystem_ with a range of stakeholders, including many
developers (authoring indpendent extensions) and administrators (managing
independent deployments with independent configurations).
...
## tldr
```php
function example_civicrm_alterAngular($angular) {
$angular->add(\Civi\Angular\ChangeSet::create('mychanges')
->alterHtml('~/crmMailing/EditMailingCtrl/2step.html', function(phpQueryObject $doc) {
$doc->find('[ng-form="crmMailingSubform"]')->attr('cat-stevens', 'ts(\'wild world\')');
})
);
function mailwords_civicrm_alterAngular(\Civi\Angular\Manager $angular) {
$changeSet = \Civi\Angular\ChangeSet::create('inject_mailwords')
// ->requires('crmMailing', 'mailwords')
->alterHtml('~/crmMailing/BlockSummary.html',
function (phpQueryObject $doc) {
$doc->find('.crm-group')->append('
<div crm-ui-field="{name: \'subform.mailwords\', title: ts(\'Keywords\')}">
<input crm-ui-id="subform.mailwords" class="crm-form-text" name="mailwords" ng-model="mailing.template_options.keywords">
</div>
');
});
$angular->add($changeSet);
}
```
cv ang:html:show
\ No newline at end of file
......@@ -48,7 +48,7 @@ pages:
- Quick Start: framework/angular/quickstart.md
- File Names: framework/angular/files.md
- Loader: framework/angular/loader.md
- Modifications: framework/angular/modify.md
- Change Sets: framework/angular/modify.md
- Asset Builder: framework/asset-builder.md
# Bootstrap: /framework/bootstrap.md
# Cache: /framework/cache.md
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment