ykmnkmi / jinja.dart

Jinja2 template engine port for Dart.
https://pub.dev/packages/jinja
MIT License
52 stars 11 forks source link

How can I implement jinja for flutter with below template? #12

Open chauvansang1997 opened 2 years ago

chauvansang1997 commented 2 years ago

"{% 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?

ykmnkmi commented 2 years ago

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),
      ),
    );
  }
}