jinja.dart
jinja.dart copied to clipboard
How can I implement jinja for flutter with below template?
"{% if field_manager_phone and field_manager_name %}, or you can directly call your {field_manager_name} at {field_manager_phone} {% endif %}. We look forward" When field_manager_phone and field_manager_name is empty the sentence "or you can directly call your {field_manager_name} at {field_manager_phone}" will be removed. Can you help me?
Something like that?
I don't like global variables. You can store tamplate in variable var template = environment.fromString('...')
, without loader.
import 'package:flutter/material.dart';
import 'package:jinja/jinja.dart';
import 'package:provider/provider.dart';
const source1 =
'... {% if phone and name %}, or you can directly call your {{ name }} at {{ phone }} {% endif %}. We look forward ...';
void main() {
runApp(
Provider<Environment>(
create: (context) {
var loader = MapLoader({'source1': source1});
return Environment(loader: loader);
},
child: const App(),
),
);
}
class App extends StatelessWidget {
const App({super.key});
@override
Widget build(BuildContext context) {
return const MaterialApp(
title: 'Flutter Demo',
home: HomePage(title: 'Flutter Demo Home Page'),
);
}
}
class HomePage extends StatefulWidget {
const HomePage({super.key, required this.title});
final String title;
@override
State<HomePage> createState() {
return HomePageState();
}
}
class HomePageState extends State<HomePage> {
int counter = 0;
String phone = '';
String name = '';
late Template template;
@override
void initState() {
super.initState();
template = context.read<Environment>().getTemplate('source1');
}
void incrementCounter() {
setState(() {
counter += 1;
if (counter % 2 == 0) {
phone = '<phone>';
} else {
phone = '';
}
if (counter % 3 == 0) {
name = '<name>';
} else {
name = '';
}
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
const Text('You have pushed the button this many times:'),
Text('$counter', style: Theme.of(context).textTheme.headline4),
const Text('Template render:'),
Text(template.renderMap({'phone': phone, 'name': name})),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: incrementCounter,
tooltip: 'Increment',
child: const Icon(Icons.add),
),
);
}
}