A minimalistic Angular package for evaluating mathematical expression and creating expression tree from infix notation
npm install --save ngx-expression-builderInclude the service NgExpressionBuilderService into the providers array of corresponding module or component
import { NgExpressionBuilderService } from 'ng-expression-builder';
@NgModule({
declarations: [
...
],
imports: [
...
],
providers: [NgExpressionBuilderService], // here
exports: [
...
]
})
export class MyModule { }@Component({
selector: 'my-component',
templateUrl: './my-component.component.html',
styleUrls: ['./my-component.component.scss'],
providers: [NgExpressionBuilderService] // here
})
export class MyComponent { ... }Now inject the service into the corresponding Angular component through constructor
constructor(private readonly ngExpressionBuilderService: NgExpressionBuilderService) { ... }
| Name | Input | Output | Description |
|---|---|---|---|
generateExpressionTree |
infix expression (string) | expression tree structure | Converts the infix expression into a binary tree structure |
evaluateExpression |
infix expression (string) | value (number) | Evaluates the value of the expression |
const infixExpression: string = '((2*(6-1))/2+5)*4';
const answer = this.ngExpressionBuilderService.evaluateExpression(infixExpression);
console.log(answer);
// Output:
40
const infixExpression: string = '(a + b) > 10 AND (c * (-5))/100';
const tree = this.ngExpressionBuilderService.generateExpressionTree(this.rawQueryString);
console.log(tree);
// Output:
{
"operatorSymbol": "AND",
"operatorName": "And",
"children": [
{
"value": {
"operatorSymbol": ">",
"operatorName": "Greater than",
"children": [
{
"value": {
"operatorSymbol": "+",
"operatorName": "Add",
"children": [
{
"value": "a",
"nodeType": "Left node",
"type": "string"
},
{
"value": "b",
"nodeType": "Right node",
"type": "string"
}
]
},
"nodeType": "Left node",
"type": "Node"
},
{
"value": 10,
"nodeType": "Right node",
"type": "number"
}
]
},
"nodeType": "Left node",
"type": "Node"
},
{
"value": {
"operatorSymbol": "/",
"operatorName": "Divide",
"children": [
{
"value": {
"operatorSymbol": "*",
"operatorName": "Multiply",
"children": [
{
"value": "c",
"nodeType": "Left node",
"type": "string"
},
{
"value": -5,
"nodeType": "Right node",
"type": "number"
}
]
},
"nodeType": "Left node",
"type": "Node"
},
{
"value": 100,
"nodeType": "Right node",
"type": "number"
}
]
},
"nodeType": "Right node",
"type": "Node"
}
]
}
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent